fullcalender.formatdate not working

by user3835579   Last Updated May 23, 2020 00:26 AM

I am trying to integrate fullcalender to php mysql.I have used the following code.I want to format the date such it will come in format yyyy/mm/dd but when i use format statements the code isn't working properly.If i remove format date it seems working but inserting 0000/0000/000 00:00 in the database.

my code:

 // Convert the allDay from string to boolean
 eventRender: function(event, element, view) {
   if (event.allDay === 'true') {
     event.allDay = true;
   } 
   else {
     event.allDay = false;
   }
 },
 selectable: true,
 selectHelper: true,
 select: function(start, end, allDay) {
   var title = prompt('Sample Textbox:');
   if (title) {
     start = $.fullCalendar.formatDate(start, "yyyy-MM-dd HH:mm:ss");
     end = $.fullCalendar.formatDate(end, "yyyy-MM-dd HH:mm:ss");
     $.ajax({
       url: 'http://localhost/fullcalendar/demos/add_events.php',
       data: 'title='+ title+'&start='+ start +'&end='+ end  ,
       type: "POST",
       success: function(json) {
         alert('Added Successfully');
         alert(json);
       }
    });   
    calendar.fullCalendar('renderEvent',
      {
        title: title,
        start: start,
        end: end,
        allDay: allDay
      },
      true // make the event "stick"
    );
  }
  calendar.fullCalendar('unselect');
},

Can anybody tell me what is the issue? If i remove format date it's working else it's not working. But i must format the data to get it properly inserted in the database. I just want date only no need of hours.



Answers 4


First if you are looking for date only not hours, you should probably use:

start = $.fullCalendar.formatDate(start, "yyyy/MM/dd");
end = $.fullCalendar.formatDate(end, "yyyy/MM/dd");

Instead of this:

start = $.fullCalendar.formatDate(start, "yyyy-MM-dd HH:mm:ss");
end = $.fullCalendar.formatDate(end, "yyyy-MM-dd HH:mm:ss");

If you remove date format it seems working because it's inserting dates like a timestamp (it looks like timestamp). Try changing your database structure type to VARCHAR and you will see something like this:

1405468800000

When you are using dateFormat function, you should look in your web browser console logs. You'll probably see:

Uncaught TypeError: undefined is not a function

It's because $.fullCalendar.formatDate method no more exist on fullCalendar V2 (changeLog). You may use Moment.js with .format() method (doc).

Don't forget to import moment.js and edit your start and end variables to:

start=moment(start).format('YYYY/MM/DD');
end=moment(end).format('YYYY/MM/DD');

It should fix your issues.

Tifa
Tifa
July 16, 2014 12:07 PM

As Tifa's answer suggests : if you don't need the time part, don't encode it :

start = $.fullCalendar.formatDate(start, "yyyy-MM-dd");

Another problem lies in the parameter string you pass to your ajax request :

data: 'title='+ title+'&start='+ start +'&end='+ end  ,

This string is not url encoded.

The easiest way to correct this is to pass an object, and let jQuery handle the encoding :

data: {'title': title, 'start': start, 'end': end } ,
LeGEC
LeGEC
August 19, 2014 09:12 AM

this code below should do the trick. (assuming you have the moment.min.js lib)

        start=moment(start).format('YYYY-MM-DDTHH:mm:ssZ'); 
        end=moment(end).format('YYYY-MM-DDTHH:mm:ssZ'); 
Michel
Michel
March 31, 2015 15:00 PM

select: function(start, end){

       var converted_start = moment(start).format('YYYY-MM-DD:HH:mm:ssZ');// the "Z" will adjust for time zone
       var converted_end = moment(end).format('YYYY-MM-DD:HH:mm:ssZ');

    },
Stnfordly
Stnfordly
May 23, 2020 00:25 AM

Related Questions



Recurring Events in FullCalendar

Updated July 24, 2019 10:26 AM



how to customise the full calendar in a selectAllow

Updated September 07, 2018 12:26 PM