0

jQuery の on() イベントを datepicker で使用しようとしています。フローは、ユーザーがドロップダウン リストから値を選択することです。開始日の maxDate を開始日の selectedDate から 30 日後に設定する終了イベントが開始日に添付されます。

 $("#ddlRentalTerm").on("change", OnRentalTermChange);

 $("#txtRentalStartDate").datepicker({
    dateFormat: "mm-dd-yy",
    showOn: "button",
    buttonImageOnly: true,
    buttonImage: "Images/iconCalendar0.gif",
    buttonText: "Start Date",
    minDate: -89,
    onSelect: function (selectedDate) {
        $("#txtRentalEndDate").datepicker("option", "minDate", selectedDate);
        PopulateNumberOfWeeks(false);
    }
});

$("#txtRentalEndDate").datepicker({
    dateFormat: "mm-dd-yy",
    showOn: "button",
    buttonImageOnly: true,
    buttonImage: "Images/iconCalendar0.gif",
    buttonText: "End Date",
    minDate: -89,
    onSelect: function (selectedDate) {
        $("#txtRentalStartDate").datepicker("option", "maxDate", selectedDate);
        PopulateNumberOfWeeks(false);
    }
});



 function OnRentalTermChange(event) {
  var $btnCreatePO = $("#btnCreatePO");
  var $startdate = $("#txtRentalStartDate");
  var $enddate = $("#txtRentalEndDate");
  var selectedDate = new Date();

  var selRental = $("#ddlRentalTerm").val();

  if (selRental === "1") {
    $startdate.datepicker("option", "onClose", BindShortTermDate);
    $startdate.datepicker("refresh");
    $btnCreatePO.attr('disabled', 'disabled');
  }
  else
  {
    RestoreShortTermStartDate();
    RestoreShortTermEndDate();
    $btnCreatePO.attr('disabled', false);
  }

};

function BindShortTermDate(dateText, instObj)
{
   var $startdate = $("#txtRentalStartDate");
   var $enddate = $("#txtRentalEndDate");
   var selectedDate = new Date(dateText);
   var maxDate = new Date();
   maxDate.setDate(selectedDate.getDate() + 30);
   $enddate.datepicker("setDate",maxDate);

  $enddate.datepicker("option",{
    numberOfMonths: 2,
    minDate: selectedDate,
    maxDate: maxDate, 
    changeMonth: false, 
    changeYear: false
  });
  $enddate.datepicker("refresh");
}

そのため、さまざまな例を一緒にマッシュアップしようとしましたが、結果は得られません。必要以上に難しくしているのではないでしょうか。datepicker で on( ) を実行しようとしましたが、エラーになります。オプションを変更する必要があるたびに、datepicker を破棄して再作成する必要がありますか? ありがとう!

jsFiddle: jsfiddle.net

4

1 に答える 1

0

変更するオプションを変更してから、日付ピッカーを更新します。

イベントを日付ピッカー自体にバインドする場合は onSelect を使用し、それ以外の場合は標準の $.on を使用します

オプションの変更: http://api.jqueryui.com/datepicker/#method-option

更新: http://api.jqueryui.com/datepicker/#method-refresh

onselect: http://api.jqueryui.com/datepicker/#option-onSelect

ではごきげんよう

-レデジェ

于 2013-02-08T16:12:39.437 に答える