javascript - Fullcalendar: How to create Bootstrap Modal box on click of a custom button? -
in fullcalendar, want create bootstrap modal on click of custom button.i not know how it. have tried , kept prompt box, not requirement. me how pop modal on click of button click. following code:-
<script> $(document).ready(function() { $.ajax({ url: "calendar/show_holidays", type: 'post', // send post data data: 'type=fetch', async: true, success: function(s){ holidays =s; // holidays = '['+s+']'; //alert(holidays); $('#calendar').fullcalendar('addeventsource', json.parse(holidays)); } }); $('#calendar').fullcalendar({ custombuttons: { eventbutton: { text:'add event', click:function(event, jsevent, view){ console.log(event.id); var title = prompt('event title:', event.title, { buttons: { ok: true, cancel: false} }); if (title){ event.title = title; console.log('type=changetitle&title='+title+'&eventid='+event.id); $.ajax({ url: '/calendar/show_holidays', data: 'type=changetitle&title='+title+'&eventid='+event.id, type: 'post', datatype: 'json', success: function(response){ if(response.status == 'success') $('#calendar').fullcalendar('updateevent',event); }, error: function(e){ alert('error processing request: '+e.responsetext); } }); } } } }, utc: true, header: { left: 'prev,next today eventbutton', center: 'title', right: 'month,agendaweek,agendaday' }, editable: true, droppable: true, eventclick: function(calevent, jsevent, view) { alert('event: ' + calevent.title); // change border color fun $(this).css('border-color', 'red'); }, eventafterrender: function(event, element, view) { element.append(event.title); } }); //$('#calendar').fullcalendar('addeventsource', jsonevents); }); </script>
in html code have added :-
<div id='calendar'></div>
Comments
Post a Comment