Fullcalendar with mysql unable to add event - php

Question

I searched around for solution, I look at my code again and again, but I am new at ajax and php, here is my code for the calendar:
<script>
$(document).ready(function() {
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
var calendar = $('#calendar').fullCalendar({
editable: true,
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
events: "http://mysite.site40.net/fullcalendar/events.php",
// 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('Event Title:');
//var url = prompt('Type Event url, if exits:');
if (title) {
var start = $.fullCalendar.formatDate(start, "yyyy-MM-dd HH:mm:ss");
var end = $.fullCalendar.formatDate(end, "yyyy-MM-dd HH:mm:ss");
$.ajax({
url: 'http://mysite.site40.net/fullcalendar/add_events.php',
data: 'title='+ title+'&start='+ start +'&end='+ end,
type: "POST",
success: function(json) {
alert('Added Successfully');
}
});
calendar.fullCalendar('renderEvent',
{
title: title,
start: start,
end: end,
allDay: allDay
},
true // make the event "stick"
);
}
calendar.fullCalendar('unselect');
},
editable: true,
eventDrop: function(event, delta) {
var start = $.fullCalendar.formatDate(event.start, "yyyy-MM-dd HH:mm:ss");
var end = $.fullCalendar.formatDate(event.end, "yyyy-MM-dd HH:mm:ss");
$.ajax({
url: 'http://mysite.site40.net/fullcalendar/update_events.php',
data: 'title='+ event.title+'&start='+ start +'&end='+ end +'&id='+ event.id ,
type: "POST",
success: function(json) {
alert("Updated Successfully");
}
});
},
eventClick: function(event) {
var decision = confirm("Do you really want to do that?");
if (decision) {
$.ajax({
type: "POST",
url: 'http://mysite.site40.net/fullcalendar/delete_event.php',
data: '&id=' + event.id,
success: function(json) {
$('#calendar').fullCalendar('removeEvents', event.id);
alert("Updated Successfully");}
});
}
},
eventResize: function(event) {
var start = $.fullCalendar.formatDate(event.start, "yyyy-MM-dd HH:mm:ss");
var end = $.fullCalendar.formatDate(event.end, "yyyy-MM-dd HH:mm:ss");
$.ajax({
url: 'http://mysite.site40.net/fullcalendar/update_events.php',
data: 'title='+ event.title+'&start='+ start +'&end='+ end +'&id='+ event.id ,
type: "POST",
success: function(json) {
alert("Updated Successfully");
}
});
}
});
});
I have event.php and add_event.php
event.php
<?php
// liste des evenements
$json = array();
// requete qui recupere les evenements
$requete = "SELECT * FROM evenement ORDER BY id";
// connexion a la base de donnees
try {
$bdd = new PDO('mysql:host=myhost;dbname=dbname', 'username', 'password');
} catch(Exception $e) {
exit('Impossible de se connecter a la base de donnees.');
}
// execution de la requete
$resultat = $bdd->query($requete) or die(print_r($bdd->errorInfo()));
// envoi du resultat au success
echo json_encode($resultat->fetchAll(PDO::FETCH_ASSOC));
?>
add_event.php
<?php
$title=$_POST['title'];
$start=$_POST['start'];
$end=$_POST['end'];
// connexion a la base de donnees
try {
$bdd = new PDO('mysql:host=myhost;dbname=dbname', 'username', 'password');
} catch(Exception $e) {
exit('Impossible de se connecter a la base de donnees.');
}
$sql = "INSERT INTO evenement (title, start, end) VALUES (:title, :start, :end)";
$q = $bdd->prepare($sql);
$q->execute(array(':title'=>$title, ':start'=>$start, ':end'=>$end));
?>
Is something wrong?
I have two folders in calendar folder css and js. I have to move all of the css and js files there.
I manually added events to my db and I try to show them with php and work perfectly.
The problem is adding an event to a calendar by clicking on a να day. I can't add an event by clicking on a day. The dialog appears and I wrote text as the title. I pressed ok but nothing in the database and the calendar. The event didn't added.
Thanks
The problem was those lines
var start = $.fullCalendar.formatDate(start, "yyyy-MM-dd HH:mm:ss");
var end = $.fullCalendar.formatDate(end, "yyyy-MM-dd HH:mm:ss");
change to
var start = moment(start).format('YYYY-MM-DDTHH:mm:ssZ');
var end = moment(end).format('YYYY-MM-DDTHH:mm:ssZ');
but the second problem still there. when i click (in day view) on any hour the event saved with 00:00:00 time... and the row doesnt turn to blue resizable row.. with duration.. but go top to all day events
edit: i put an alert with start. When i click on 9:00am to add event show that 2015-08-17T09:00:00+00:00. but in database save 00:00:00
edit 2: i make a change this
var start = moment(start).format('YYYY-MM-DDTHH:mm:ssZ');
var end = moment(end).format('YYYY-MM-DDTHH:mm:ssZ');
to this
var start = moment(start).format('YYYY-MM-DD HH:mm:ssZ');
var end = moment(end).format('YYYY-MM-DD HH:mm:ssZ');
and save the event with time. but in day view the event appear to all day event and not in list with hours. When im trying to drag and drop ninside that list, goes there but as a litle line at the top of the row... (and when refresh the page the event will go back to allday events as i have problem with moving events...)
any ideas?