У меня есть следующая разметка:
У меня есть экземпляр fullcalendar. При нажатии на день (запуск dayClick -callback) dayClick мода bootstrap, где пользователь может ввести заголовок и дату начала / окончания. После нажатия на ok эти значения будут добавлены в календарь. Вот код для этого:
function addTitle(){ //having a button onClick="addTitle()" var title = $('#add_date_title').val(); var startdate = $('#add_date_startdate').val(); var enddate = $('#add_date_enddate').val(); var end_split = enddate.split('-'); end_split[2]= parseInt(end_split[2])+parseInt("1"); enddate = end_split[0] + "-" + end_split[1] + "-" + end_split[2]; $('#add_date_title').val(''); $('#add_date_startdate').val(''); $('#add_date_enddate').val(''); $('#add_date_modal').modal('hide'); var myCalendar = $('#calendar'); var myEvent = { title:title, allDay: true, start: startdate, end: enddate }; myCalendar.fullCalendar( 'renderEvent', myEvent ); }
Итак, событие теперь в календаре. Но когда, например, переключая месяц или перезагружая страницу, все данные теряются, конечно, потому что они нигде не сохраняются.
Теперь возникает вопрос: как я могу сохранить событие непосредственно в базе данных, а затем загрузить его, поэтому, где я могу принести PHP-код, чтобы сохранить событие в db … Проблема, почему я спрашиваю, что сайт между добавлением событий никогда не перезагружается, поэтому я не могу проверить GET или POST-параметры или что-то подобное … Могу ли я сделать это с помощью AJAX? Если да, то как? Потому что я не очень хорошо знаком с AJAX.
Фактически вы можете сохранить события в БД.
Получите значения типа title, startdate, date date в modal и отправьте их в следующем ajax
$.ajax({ url: 'add_events.php', data: 'title='+ title+'&start='+ start2 +'&end='+ end2, type: "POST", success: function(json) { $( "#getReason" ).modal('hide'); $('#mydiv').hide(); $('body').removeClass('blockMask');//calendar.fullCalendar( 'refetchEvents'); $('#calendar').fullCalendar('refetchEvents'); } });
в add_events.php сохранить данные в db
На главной странице используйте этот метод для динамического создания источника событий
function eventSourceCall(){ eventSourceCall = [ { url: 'events.php?status=absent', backgroundColor: 'red', borderColor: 'white', textColor: 'white', rendering: 'background', cache: false }
в events.php выполнить операцию select и получить параметры события как json закодированные объекты и вернуть их.
В функции календаря eventSources: eventSourceCall, добавьте эту строку для выбора источника события.
Используйте эту ссылку для fullcalendar
Кликните сюда……..
* Извлечь данные из базы данных и отобразить в полноэкранном режиме *