2

Datepicker2 つの異なるテキスト フィールドに jQuery を使用します。開始日用のフィールドと終了フィールド用の別のフィールド。を使用して現在の日付より前の日付を無効にしますminDate。私のコードは次のようなものです：

$( "#start" ).datepicker({
    minDate: 0,
    dateFormat: 'yyyy-mm-dd',
    showOnFocus: true,
    showTrigger: '<img src="<?php echo base_url()?>images/calender.png" />'
});    

$( "#end" ).datepicker({
    minDate: 0,
    dateFormat: 'yyyy-mm-dd',
    showOnFocus: true,
    showTrigger: '<img src="<?php echo base_url()?>images/calender.png" />'
});

ここで、終了日が開始日以上である必要があることを確認する必要があります。また、終了日フィールドでは、選択した開始日より前のすべての日付を無効にする必要があります。どうすればそれができますか？

4

4 に答える 4

1

まず、答えを見つけるのを手伝ってくれたすべての人に感謝します。

私の質問の解決策は、次のコードを使用することです。

$(document).ready(function(){
  $("#depart ,#return_date").datepick({
    minDate:0,
    dateFormat:'yyyy-mm-dd',
    showOnFocus: true,
    showTrigger: '<img src="<?php echo base_url()?>images/calender.png" />',
    onSelect: customRange
  });

  function customRange(dates) {
    if (this.id == 'depart')
    {
      $('#return_date').datepick('option', 'minDate', dates[0] || null);
    }
    else
    {
      $('#depart').datepick('option', 'maxDate', dates[0] || null);
    }
  }
});
于 2012-05-25T04:25:22.910 に答える
1

必要なコードの例を次に示します。

<script>
    $(function() {
        var dates = $( "#from, #to" ).datepicker({
            defaultDate: "+1w",
            changeMonth: true,
            numberOfMonths: 3,
            onSelect: function( selectedDate ) {
                var option = this.id == "from" ? "minDate" : "maxDate",
                    instance = $( this ).data( "datepicker" ),
                    date = $.datepicker.parseDate(
                        instance.settings.dateFormat ||
                        $.datepicker._defaults.dateFormat,
                        selectedDate, instance.settings );
                dates.not( this ).datepicker( "option", option, date );
            }
        });
    });
    </script>

デモは次の場所で見ることができます: Datepicker

Jquery UI Web サイトから参照。

于 2012-05-24T06:18:36.637 に答える
0

複雑な日付関連の操作には datejs ライブラリを使用 --> datejs.com

于 2012-05-24T05:37:06.020 に答える
0

開始日が変更された場合は、終了日をリセットする必要があります。これでうまくいくはずです。

<script type="text/javascript">
    $(document).ready(function () {
        $('#start').datepicker({
            minDate: '-1d',
            dateFormat: 'yy-mm-dd',
            showTrigger: '<img src="<?php echo base_url()?>images/calender.png" />'
        });

        $('#end').datepicker({
            minDate: '-1d',
            dateFormat: 'yy-mm-dd',
            showTrigger: '<img src="<?php echo base_url()?>images/calender.png" />'
        });

        $('#start').change(function () {
            var sDate = $('#start').val().split("-");
            var endMinDate = new Date(sDate[0], sDate[1] - 1, sDate[2]);
            $('#end').datepicker('option', 'minDate', endMinDate);
        });
    }); 
</script>
于 2012-05-24T06:18:41.053 に答える