Passing the date value in fullcalendar - ajax

Question

I am using fullcalendar to upload dates times to my database and i have the following script
$dialogContent.dialog({
modal: true,
title: "New Listing",
close: function() {
$dialogContent.dialog("destroy");
$dialogContent.hide();
},
buttons: {
save : function () {
calEvent.id = id;
id++;
calEvent.start = new Date(startField.val());
calEvent.end = new Date(endField.val());
calEvent.title = titleField.val();
calEvent.body = bodyField.val();
$.ajax({
type: "POST",
url: "addnew.php",
data: (
{
'st':new Date(startField.val()),
'et':new Date(endField.val()),
'title':titleField.val(),
'body':bodyField.val()
}
),
success: function(msg){
alert( "Data Saved: " + msg );
}
});
However my date values are not being sent at all. Its wrong but I don't know how or why.

Answer 1

the Date constructor does not parse any old date string. use fullCalendar's parsing function instead (provided you are using ISO8061 format):
http://arshaw.com/fullcalendar/docs/utilities/parseDate/

Answer 2

What value of date do you get in server side?
May be, you should to send simple data type like UNIX timestamp or using .serialize() for your form.

Answer 3

I have been playing around with ParseDate but I'm just not getting results, seems I have the concept all wrong;
dayClick : function(date, allDay, jsEvent, view) {
var $dialogContent = $("#event_edit_container");
y = date.getFullYear();
m = date.getMonth();
d = date.getDate();
h1 = date.getHours();
m1 = date.getMinutes();
h2 = h1 + 1;
m2 = m1;
calEvent = { title: 'New Calendar Event', editable:true, distributor: '', etype: '', location: '', website: '', start: new Date(y, m, d, h1, m1), end: new Date(y, m, d, h2, m2), allDay: false };
$calendar.fullCalendar("renderEvent",calEvent, true);
resetForm($dialogContent);
var startField = $dialogContent.find("select[name='start']").val(calEvent.start);
var endField = $dialogContent.find("select[name='end']").val(calEvent.end);
var titleField = $dialogContent.find("input[name='title']").val(calEvent.title);
var distributorField = $dialogContent.find("input[name='distributor']").val(calEvent.distributor);
var etypeField = $dialogContent.find("select[name='etype']").val(calEvent.etype);
var locationField = $dialogContent.find("input[name='location']").val(calEvent.location);
var websiteField = $dialogContent.find("input[name='website']").val(calEvent.website);
var bodyField = $dialogContent.find("textarea[name='body']");
//var start_date = eval($.fullCalendar.parseDate(this_one['start']).getTime()) / 1000;
$dialogContent.dialog({
modal: true,
title: "New Listing",
close: function() {
$dialogContent.dialog("destroy");
$dialogContent.hide();
},
buttons: {
save : function () {
calEvent.id = id;
id++;
calEvent.start = $.fullCalendar.parseDate(new Date(startField.val()));
calEvent.end = new Date(endField.val());
calEvent.title = titleField.val();
calEvent.distributor = distributorField.val();
calEvent.etype = etypeField.val();
calEvent.location = locationField.val();
calEvent.website = websiteField.val();
calEvent.body = bodyField.val();
//$.fullCalendar.parseDate(calEvent.start);
//calEvent.st = start_date.val();
//$.fullCalendar.parseDate(startField.val());
$.ajax({
type: "POST",
url: "addnew.php",
data: (
{
'st':calEvent.start,
'et':new Date(endField.val()),
'title':titleField.val(),
'distributor':distributorField.val(),
'etype':etypeField.val(),
'location':locationField.val(),
'website':websiteField.val(),
'body':bodyField.val()
}
),
success: function(msg){
alert( "Data Saved: " + msg );
}
});
I'm at a brick wall with this I've tried tons of variations of hte code but its all just guess work. If there is an example of the date filed being passed or even printed out I'd really appreciate it just to see how this should work. Trial and error is not working for me in this case.
Thanks

Answer 4

It's late and i haven't used Javascript in a while, but surely it's input.value not input.val()