Блог

У меня есть входные данные datepicker, которые заполняются сегодняшней датой при загрузке страницы. При использовании datepicker дата разбивается на месяц, день и год и помещается в три скрытых поля, которые отправляются на сервер с данными post. Проблема возникает, когда пользователь решает, что сегодняшняя дата подходит, и не использует datepicker; как мне поместить фрагменты даты в эти три скрытых поля?

Я пытался разбить сегодняшнюю дату на части и добавить ее в эти поля, но все способы, которыми я пытался добавить ее в jQuery или используя обычный JavaScript, ломают все это. Вот рабочий код, на котором я хотел бы основываться:

jQuery

 $(function() {
    //set your date picker
        $("#CI").datepicker({
        dateFormat: 'mm/dd/yy',
        changeMonth: true,
        changeYear: true,
        showOn: "both",
        buttonImage: "css/images/calendar-green.gif",
        buttonImageOnly: true,
        buttonImageText: "Calendar",
        beforeShow: function(dateText, instance) { 
            $("#CI").datepicker('setDate', new Date());
        },
        onSelect: function(dateText, instance) {
            var pieces = dateText.split("/");
             $("#CID").val(pieces[0]);
             $("#CIM").val(pieces[1]);
             $("#CIY").val(pieces[2]);
         }                
    })

    //get the current date
    var todaysDate = new Date();
    //format the date in the right format (add 1 to month because JavaScript counts from 0)
    formatDate = (todaysDate.getMonth()   1)   '/'   
                         todaysDate.getDate()   '/'   
                         todaysDate.getFullYear();
    //set the input value
    $('#CI').val(formatDate);       
});
  

HTML

 <input type='text' id='CI' name="CI">
<input type="text" name="CID" id="CID" />
<input type="text" name="CIM" id="CIM" />
<input type="text" name="CIY" id="CIY" />
  

Разделите свою onSelect() функциональность на отдельную функцию, которую можно вызывать дважды.

Наличие одной и той же функции, выполняющей обе задачи, позволяет вам справляться с любыми изменениями в вашей функциональности или структуре HTML.

итак…

 $(function() {
    function populateHidden(dateText){
        var pieces = dateText.split("/");
        $("#CID").val(pieces[0]);
        $("#CIM").val(pieces[1]);
        $("#CIY").val(pieces[2]);
    }
    //set your date picker
    $("#CI").datepicker({
        dateFormat: 'mm/dd/yy',
        changeMonth: true,
        changeYear: true,
        showOn: "both",
        buttonImage: "css/images/calendar-green.gif",
        buttonImageOnly: true,
        buttonImageText: "Calendar",
        beforeShow: function(dateText, instance) { 
            $("#CI").datepicker('setDate', new Date());
        },
        onSelect: populateHidden
    })

    //get the current date
    var todaysDate = new Date();
    //format the date in the right format (add 1 to month because JavaScript counts from 0)
    formatDate = (todaysDate.getMonth()   1)   '/'   
                         todaysDate.getDate()   '/'   
                         todaysDate.getFullYear();
    //set the input value
    $('#CI').val(formatDate); 
    populateHidden(formatDate); 
});
  

Используйте следующий код:

    //get the current date
    var todaysDate = new Date();
    //format the date in the right format (add 1 to month because JavaScript counts from 0)
    var month = todaysDate.getMonth()   1 ;
    var date = todaysDate.getDate();
    var year =todaysDate.getFullYear() ;

    formatDate = month   '/'  
                   date  '/'  
                   year;
    //set the input value
    $('#CI').val(formatDate);       

    $("#CID").val(date);
    $("#CIM").val(month);
    $("#CIY").val(year);