I have a form on a site that I am working on that needs to post (php) a day, a month, and a year. On the old site this was done in form of select menus but I would much rather use an html5 date input box or a jquery-ui datepicker.

 

This is what I'm trying to convert: http://jsfiddle.net/#&togetherjs=8raaw5a4xz

 

 

Into: http://jsfiddle.net/#&togetherjs=tGLsw63Fbz

 

 

 

PS. There seems to be a new beta collaboration thingy on jsfiddle. I'm not really sure how it works.

PPS. I probably don't need to support netscape or ie 4 like in the original

http://jsfiddle.net/DSpjN/ you can use something like that but instead of processing the date on change process it when you submit the form

Great, thank you. So I've come up with this so far:

$(function () {
    
    $('#date').on('change', function() {
         var new_val = jQuery(this).val().split('-'),
             dateYear = parseInt(new_val[0]),
             dateMonth = parseInt(new_val[1]),
             dateDay = parseInt(new_val[2]);
          
        $('<input>', {
            type: 'text',
            name: 'date_day',
            id: 'date_day',
            value: dateDay
        
        }).appendTo('label');
        
        $('<input>', {
            type: 'text',
            name: 'date_month',
            id: 'date_month',
            value: dateMonth
        
        }).appendTo('label');
        
        $('<input>', {
            type: 'text',
            name: 'date_year',
            id: 'date_year',
            value: dateYear
        
        }).appendTo('label');
        
     });
   
});

 

appendTo('label'); is definitely wrong since since I have several labels on the form. I also need to get rid of the original date input before submitting. Plus I am going to run into problems if someone changes the date as there will be several extra input fields. I'm sure this is far from the best way of doing this but it seems to be getting there.

 

http://jsfiddle.net/tu5WU/

Edited September 27, 201312 yr by mantis