0

現在、jQuery を使用して、datepicker を使用しています。

開始日と終了日の 2 つの入力フィールドがあります。それぞれをクリックすると、日付ピッカーが飛び出します。

「終了日」フィールドについては、jQuery 日付ピッカーで同じ日を強調表示したいと思います。たとえば、ユーザーが開始日として 2009 年 8 月 12 日を選択した場合、終了日として 2009 年 8 月 12 日より前の日付を選択することはできません。

これが私が現在持っているものです：

$("#datepicker").datepicker({minDate: +5, maxDate: '+1M +10D', changeMonth: true});
var startDate = $("#datepicker").val();
var the_date = new Date(startDate);
$("#datepicker2").datepicker({ minDate: the_date });

残念ながら、これは機能しません。

次のように値を「ハードコーディング」すると、次のようになります。

$("#datepicker2").datepicker({ minDate: new Date("08/12/2009") });

それはうまくいきます。「開始日」を「終了日」ピッカーに渡す方法についてのアイデアはありますか?

ありがとう！

4

3 に答える 3

4

これは機能しません

「ピッキング」イベントの日付ピッカーからのコールバック関数が必要です。このイベントの前に、startDate は空になります。

これを試して：

$("#datepicker").datepicker({
     minDate: +5, 
     maxDate: '+1M +10D', 
     changeMonth: true, 
     onSelect: function(dateText, inst){
               var the_date = new Date(dateText);
               $("#datepicker2").datepicker('option', 'minDate', the_date);
     }
 });
 $("#datepicker2").datepicker(); // add options if you want
于 2009-08-13T23:58:36.223 に答える
0

日時の文化は、ユーザーごとに異なります。上記のコードでは、jquery ui の最小値が機能しません。最初に終了日を選択すると、終了日に最小日が設定されません。

<input type="text" id="tbStartDate" value="" disabled="disabled" />
<input type="text" id="tbEndDate" value="" disabled="disabled" />

<script type="text/javascript">
    $(document).ready(function () {
        $("#tbStartDate").datepicker({
            //minDate: +5, 
            //maxDate: '+1M +10D', 
            //changeMonth: true,
            dateFormat: 'dd-mm-yy',
            showOn: 'button',
            buttonImageOnly: true,
            buttonImage: '/Content/Calendar.png',
            buttonText: 'Click here (date)',
            onSelect: function (dateText, inst) {
                $('#tbEndDate').datepicker("option", 'minDate', new Date($("#tbStartDate").datepicker('getDate')));
            },
            onClose: function (dateText, inst) {
                //$("#StartDate").val($("#tbStartDate").val());
            }
        });

        $("#tbEndDate").datepicker({
            dateFormat: 'dd-mm-yy',
            showOn: 'button',
            buttonImageOnly: true,
            buttonImage: '/Content/Calendar.png',
            buttonText: 'Click here (date)',
            onClose: function (dateText, inst) {
                //$("#EndDate").val($("#tbEndDate").val());
            }
        });

        $('#tbEndDate').datepicker("option", 'minDate', new Date($("#tbStartDate").datepicker('getDate')));
    });
</script>
于 2012-07-26T09:59:39.033 に答える
0

開始日 終了日 http://rowsandcolumns.blogspot.com/2010/07/jquery-start-dateend-date-datepicker.html

于 2010-07-31T07:47:28.823 に答える