CODEWITHSUNDEEP
javascriptjquerydatepickerjquery-ui-timepicker
Amir
Amir

Reputation: 4760

How can I extract the date and time from a timestap inside of an input field with jQuery?

Ok I'm running into an issue with jQuery and UI date picker.

Essentially I have 3 fields in my NEW event form: Date, timeFrom, timeTo And 3 fields in my SQL database: Date(datetime), timeFrom(time), timeTo(time)

Date field, is selected with the datepicker and would submit looking something like this: 3/19/13 timeFrom and timeTo would be selected with the timepicker plugin and would look something like this: 06:20 am AND 07:20 am

In my SQL database the submitted data would look like this: 2013-03-19, 06:20:00.0, 07:20:00.0

Now this is all fine, until I go to edit that same event. When I call it form the database and populate my inputs again, they end up looking like this:

Date: {ts '2013-03-19 00:00:00'}

timeFrom: 1970-01-01 06:20:00.0

timeTo: 1970-01-01 07:20:00.0

So, this means that neither the datepicker, nor the timepicker are recongizing these values. And if you just submit the form again, w/o resetting the dates my code throws an error.

So I thought I need to use jquery to modify the input fields on page load so they are formatted correctly, and show up right like this :

  $(function() {
        //datefix
        var thisdatevalue = $("input[name='event[eventdate]']").val();
        var day1 = $("input[name='event[eventdate]']").val().getDate();                 
        var month1 = $("input[name='event[eventdate]']").val().getMonth();             
        var year1 = $("input[name='event[eventdate]']").val().getFullYear();
        var fullDate = day1 + "/" + month1 + "/" + year1;

        $("input[name='event[eventdate]']").val(fullDate);

        //timefix
        var thistimefromvalue = $("input[name='event[timefrom]']").val();
        var hour1 = $("input[name='event[timefrom]']").val().getHours();                 
        var minute1 = $("input[name='event[timefrom]']").val().getMinutes();             
        var second1 = $("input[name='event[timefrom]']").val().getSeconds();
        var fullTime = hour1 + ":" + minute1 + ":" + second1;

        $("input[name='event[timefrom]']").val(fullTime) ;

        //timefix
        var thistimetovalue = $("input[name='event[timeto]']").val();
        var hour2 = $("input[name='event[timeto]']").val().getHours();                 
        var minute2 = $("input[name='event[timeto]']").val().getMinutes();             
        var second2 = $("input[name='event[timeto]']").val().getSeconds();
        var fullTime = hour2 + ":" + minute2 + ":" + second2;

        $("input[name='event[timeto]']").val(fullTime) ;

    });

However, the code above is throwing TypeError: $(...).val(...).getDay is not a function is not a function.

I thought that is a standard javascript function that should do the trick for me.

Any ideas on how I can accomplish this?

Thanks!

Upvotes: 0

Views: 352

Answers (1)

Denis O.
Denis O.

Reputation: 1850

getDay() function, as all others of the same kind works only for Date object. Use following syntax to create Date object and then call desired method.

dt = new Date('2013-03-27 15:22:33');
result = dt.getFullYear()+'/'+(dt.getUTCMonth()+1)+'/'+dt.getDate()+' '+dt.getUTCHours()+':'+dt.getUTCMinutes()+':'+dt.getUTCSeconds();

Here's working sample on jsFiddle

Upvotes: 1

Related Questions