表格有2个jquery日期选择器动作

时间:2015-01-13 23:02:36

标签: php jquery forms datepicker

我有一张表格,其中包含使用jqyery日期选择器的Check-In和Check-Out 报到 查看 日期选择器脚本是:

  // datepicker
    tjq('.datepicker-wrap input').each(function() {
        var minDate = tjq(this).data("min-date");
        if (typeof minDate == "undefined") {
            minDate = 0;
        }
        tjq(this).datepicker({

            showOn: 'button',
            buttonImage: 'images/icon/blank.png',
            buttonText: '',
            buttonImageOnly: true,
            changeYear: false,
            /*showOtherMonths: true,*/
            minDate: minDate,
            dateFormat: "yy-mm-dd",
closeText: 'Inchide',
        prevText: '« Luna precedenta',
        nextText: 'Luna urmÄatoare »',
        currentText: 'Azi',
        monthNames: ['Ianuarie','Februarie','Martie','Aprilie','Mai','Iunie',
        'Iulie','August','Septembrie','Octombrie','Noiembrie','Decembrie'],
        monthNamesShort: ['Ian', 'Feb', 'Mar', 'Apr', 'Mai', 'Iun',
        'Iul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
        dayNames: ['Duminica', 'Luni', 'Marti', 'Miercuri', 'Joi', 'Vineri', 'Sambata'],
        dayNamesShort: ['Dum', 'Lun', 'Mar', 'Mie', 'Joi', 'Vin', 'Sam'],
        dayNamesMin: ['Du','Lu','Ma','Mi','Jo','Vi','Sa'],
        weekHeader: 'Sapt',
        firstDay: 1,
        isRTL: false,
        showMonthAfterYear: false,
            beforeShow: function(input, inst) {
                var themeClass = tjq(input).parent().attr("class").replace("datepicker-wrap", "");
                tjq('#ui-datepicker-div').attr("class", "");
                tjq('#ui-datepicker-div').addClass("ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all");
                tjq('#ui-datepicker-div').addClass(themeClass);
            }
        });
    });

日历

<input type="text" name="date1" class="input-text full-width hasDatepicker" id="date1"> 
<input type="text" name="date2" class="input-text full-width hasDatepicker" id="date2"> 

当我点击其中一个字段(签入或签出)时,如何改进jquery日期选择器,这样两个字段都会弹出并自动选择&#39; Check Out&#39;在入住后的第1天?

2 个答案:

答案 0 :(得分:1)

我在JSFiddle玩了一点,觉得我弄明白了你需要什么。这应该有所帮助。修改您的需求:

http://jsfiddle.net/fpcuhv35/

HTML:

<input type="text" name="date1" class="datepicker" id="date1">
<input type="text" name="date2" class="datepicker" id="date2">

JQuery的:

$(document).ready(function(){
    $("#date2").datepicker();
    $("#date1").datepicker({
        onSelect: function(){
            var fecha = $(this).datepicker('getDate');
            $("#date2").datepicker("setDate", new Date(fecha.getTime()));
            $("#date2").datepicker("setDate", "+15d");
        }
    });
});  

答案 1 :(得分:0)

@ solar411想要添加第二个setDate只是在当前日期添加15。这个修改过的JSFiddle将在一个明确选择的日期添加一天。

http://jsfiddle.net/fpcuhv35/2/

$(document).ready(function(){
    $("#date2").datepicker();
    $("#date1").datepicker({
        onSelect: function(){
            var fecha = $(this).datepicker('getDate');
            $("#date2").datepicker("setDate", new Date(fecha.getTime() + 24 * 60 * 60 * 1000));
        }
    });
});