Datepicker動的最小/最大日付

Question

ビルドしているサイトでjQueryのdatepickerプラグインを使用しています。指定した日付の範囲内から2つの日付を選択できるようにする必要があります。これは十分に簡単です。

問題は、別の選択ボックス（建物名が入っている）によって日付の許容範囲が変わることです。だから、私は何が起こる必要があるのは、mysqlデータベースの建物を調べ、許可された最小と最大の日付を返し、ユーザーが許容範囲内の日付範囲を選択できるようにdatepickerを使用することです。私のメインページで

、私は現在、使用しています：

$('#dateStartMainChart').load(url); 

を出力するPHPファイルを読み込むために：MinDateプロパティとmaxDateのは、MySQLデータベースから正しく装着されている

<script> 
$(function() { 
    $("#dateEndMainChartSelect").datepicker({ 
     dateFormat: 'yy-mm-dd', 
     defaultDate: -1, 
     minDate: new Date(2011,03,03), 
     maxDate: +0, 
      firstDay: 1, 
     changeMonth: true, 
     changeYear: true 
    }); 
}); 
</script> 
<input type="text" class="text" value=2011-03-04 id="dateEndMainChartSelect" align="center"/> 

を。しかし、その結果、datepicker要素の代わりにメインページに日付が入ったテキストボックスが表示されます。

どのような考えですか？

Answer 1

OK、これを最終的に考え出しました。私は最初、通常のように日付ピッカーを定義して使用します。

$.getScript('url.php', function() {updateDate(); }); 

私の場合は、これを選択ボックスの変更に使用します。

と呼ばれるPHPファイルは、（エコーを使用して）mysqlデータベースには、次の出力照会：

function updateDate() { 
     $("#dateStartMainChartSelect").datepicker('change',{ 
      minDate: new Date(2011,01,01), 
      maxDate: new Date(2011,02,01) 
     }); 
    } 

あなたが変更することをここに日付ピッカーのオプションのいずれかを追加することができます。 JasCavのおかげで、私は解決策のための適切な場所を探し終わった。

Answer 2

これを行うには、datepickerの "beforeShow"属性を使用してください。ここに擬似コードの例があります。

// Your start and end datepickers. 
$('#dateStartMainChart, #dateEndMainChartSelect').datetimepicker({ 
    beforeShow: customRange 
}); 

// I can't take credit for this...website to tutorial is below. 
// From: http://test.thecodecentral.com/cms/jqueryui/datepicker/ 
function customRange(input) { 
    return { minDate: (input.id == 'dateEndMainChartSelect' ? $('#dateStartMainChart').datepicker('getDate') : null), 
     maxDate: (input.id == 'dateStartMainChart' ? $('#dateEndMainChartSelect').datepicker('getDate') : null) 
    }; 
} 

データベースを直接見る必要はありません（ただし、customRange関数でフィールドを適切に調整できます）。いずれにせよ、これはあなたが必要とするものを行うはずです。