How to add button with only events using fullcalendar react?

Viewed 325

I am working on the react js project and created a calender with fullcalendar and now I need to add a button with the already added events to add more events on same date. On click of the button I will open a popup and add new event on the selected date. how can I achive this?

<FullCalendar
   plugins={[dayGridPlugin, timeGridPlugin, interactionPlugin]}
   headerToolbar={{
      left: 'prev,next today',
      center: 'title',
      right: 'dayGridMonth,timeGridWeek,timeGridDay'
   }}
   initialView='dayGridMonth'
   editable={true}
   selectable={true}
   selectMirror={true}
   eventAdd={(e) => console.log(e)}
   eventContent={renderEventContent}
   dayMaxEvents={true}
   weekends={true}
   initialEvents={this.state.list}
   select={this.dateSelectHandle}
/>

One more thing I have tried with eventContent but its added button according to events If two events are added on the same date the it shows to buttons.

function renderEventContent(eventInfo) {
  return (
    <>
         <button>+ Add New</button>
         <div>{eventInfo.timeText}</div>
         <div>{eventInfo.event.title}</div>
    </>
  )
}
0 Answers
Related