4

glDatePicker を使用して日付範囲選択システムを生成しています。

From 日付入力テキストと To 入力テキストがあります。

glDatePicker (入力から) の 1 つのインスタンスの選択された日付を値から selectableDateRange として別の (入力へ) に渡す方法はありますか?

私はこれを試しましたが、うまくいきません。

      <input type="text" id="from" />
</p>
<p> To:
  <input type="text" id="to" />
</p>
<script type="text/javascript">


var today = new Date();
var datelimit = new Date(today);
datelimit.setDate(today.getDate() + 31);

var to = $('#to').glDatePicker(true);


$('#from').glDatePicker({
    showAlways: false,
    allowMonthSelect: true,
    allowYearSelect: true,
    prevArrow: '',
    nextArrow: '',
    selectedDate: today,
    selectableDateRange: [{
        from: today,
        to: datelimit
    }, ],
    onClick: function (target, cell, date, data) {
        target.val(date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate());

        //Cambio la fecha del #to
        var toFrom = new Date(date);
        var toLimit = new Date();
        toLimit.setDate(toFrom.getDate() + 31);
        $.extend(to.options,
            {
                selectableDateRange: [{
                from: toFrom,
                to: toLimit
            }, ],
            });
            to.render();

        if (data != null) {
            alert(data.message + '\n' + date);
        }
    }
}).glDatePicker(true);

事前にt​​hnx！

4

2 に答える 2

4

最後に私は解決しました。

誰かの役に立てば幸いです。

<!DOCTYPE html>
<html>
<head>
<link href="styles/glDatePicker.default.css" rel="stylesheet" type="text/css">
</head>
<body>
<p> From:
<input type="text" id="from" />
</p>
<p> To:
<input type="text" id="to" />
</p>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script src="glDatePicker.min.js"></script> 
<script type="text/javascript">


var today = new Date();
var datelimit = new Date(today);
datelimit.setDate(today.getDate() + 31);



$('#from').glDatePicker({
    showAlways: false,
    allowMonthSelect: true,
    allowYearSelect: true,
    prevArrow: '',
    nextArrow: '',
    selectedDate: today,
    selectableDateRange: [{
        from: today,
        to: datelimit
    }, ],
    onClick: function (target, cell, date, data) {
        target.val(date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate());

        if (data != null) {
            alert(data.message + '\n' + date);
        }
    }
}).glDatePicker(true);


var to = $('#to').glDatePicker(
{
    showAlways: false,
    onClick: function (target, cell, date, data) {
        target.val(date.getFullYear() + '/' + (date.getMonth() + 1) + '/' + date.getDate());

        if (data != null) {
            alert(data.message + '\n' + date);
        }
    }
}).glDatePicker(true);

$('#to').click(function() {
    var fechaFrom = new Date($("#from").val());
    var toLimit = new Date();
    toLimit.setDate(fechaFrom.getDate() + 31);
    to.options.selectableDateRange = [{
        from: fechaFrom,
        to: toLimit
    }, ],
    to.options.showAlways = false;
    to.render();
});


</script>
</body>
</html>
于 2013-01-06T16:33:05.863 に答える
0

SauronZ answer のコードを使用しましたが、日付範囲の作成に使用する日数を変更するとエラーが発生することがわかりました。

何時間も読んだ後、スタックで正しい答えにたどり着いたスレッドを見つけました ( https://stackoverflow.com/a/19691491/2288421 )

$('#to').click 関数内に次の関数を追加しました。

function addDays(date, days) {
    var result = new Date(date);
    result.setDate(date.getDate() + days);
    return result;
}

そして、toLimit を生成するときにその関数を呼び出しました。

var tempDate = new Date($('#from').val());
toLimit = addDays(tempDate, 91);

ご覧のとおり、範囲を 91 日に設定していますが、任意の数を入力できます。

誰かがそれを見る必要がある場合に備えて、変更されたコードの完全なチャンクを次に示します。

$('#to').click(function() {
    var fechaFrom = new Date($("#from").val());
    var toLimit = new Date();

    /**** ADDED FUNCTION TO ALLOW ADDING OF ANY NUMBER OF DAYS ****/
    function addDays(date, days) {
        var result = new Date(date);
         result.setDate(date.getDate() + days);
        return result;
    }

    var tempDate = new Date($('#from').val());

    toLimit = addDays(tempDate, 91);
    to.options.selectableDateRange = [{
        from: fechaFrom,
        to: toLimit
    }, ],
    to.options.showAlways = false;
    to.render();
});
于 2014-05-13T20:09:28.020 に答える