Hi
I wanted to add a custom button to the quickinfo template but onclick event arent firing :
const Schedule = ({ filteredResults }) => {
const content = ({
Id,
elementType,
Location,
}) => {
return (
<div>
{elementType === "cell" ? (
<div className="e-cell-content e-template">
<form className="e-schedule-form">
<div>
<input
className="subject e-field"
type="text"
name="Subject"
placeholder="Title"
/>
</div>
<div>
<input
className="location e-field"
type="text"
name="Location"
placeholder="Location"
/>
</div>
</form>
</div>
) : (
<div className="e-event-content e-template flex flex-col">
<div className="e-subject-wrap">
{Location && (
<div className="display-flex-x pt-6">
<div className="e-location-icon e-icons"></div>
<div className="location">{Location}</div>
</div>
)}
<button onClick={() => console.log("here)}>Join class</button>
</div>
)}
</div>
);
};
className={styles.schedule}
cssClass="schedule-cell-dimension"
height="550px"
eventSettings={{ dataSource: filteredResults }}
eventRendered={(args) => cellTemplate(args)}
startHour="06:00"
endHour="23:30"
readonly={true}
firstDayOfWeek={1}
quickInfoTemplates={{
content: (e) => content(e),
}}
minDate={new Date(new Date().setDate(new Date().getDate() - 1))}
maxDate={getMaxDate()}
ref={(t) => (Schedule = t)}
rowAutoHeight={true}
>
<ViewsDirective>
<ViewDirective option="Week" />
<ViewDirective option="Agenda" allowVirtualScrolling={true} />
</ViewsDirective>
<Inject services={[Week, Agenda]} />
</ScheduleComponent>)
}
