2011-07-28 21 views
1

私はdatepickerを動作させており、完全に機能しています。週ピッカーが動作することを見ることができる上記の画像から、ハイライト週の開始Javascript/JQuery UI datepicker

Datepicker - Week is not highlighted

。しかし、私はdatepickerが今週を強調表示したいと思います。この例では、週の始まり全体を強調表示する必要があります。これはどのように見えますか?What I would like

これはどのように行われますか?

編集 理想的には、ページが読み込まれたときに、ユーザーが週を選択するのではなく、現在の週をハイライト表示することが理想的です。指定された例では、その日が現在選択されていますが、現在の週が自動的に選択されます。

Current Week already selected

答えて

3

クラスui-datepicker-current-dayを持って選択されたTDを、それはあるかもしれないので、何見つけたい強調表示は、clickイベントにdatepicker要素を付けることで行うことができます(例:

$("#datepicker").datepicker().click(function(event) { 
    // highlight the TR 
    $(".ui-datepicker-current-day").parent().addClass('highlight'); 

    // highlight the TD > A 
    $(".ui-datepicker-current-day").siblings().find('a').addClass('highlight2'); 
}); 

そして、あなたはあなたの心のコンテンツへhighlighthighlight2クラスを定義することができます。

日付がクリックされるたびにカレンダーが更新されるので、onSelectイベントはトリックを行いません。ここで

は一例です:http://jsfiddle.net/9DdfL/2/

+0

あなたが提供したあなたの例は、私がやろうとしていることです – David

0

以下のように日付ピッカーの日付の各行は<tr>あります。今日の日付を含む<td>要素のクラスはui-datepicker-todayです。
そのため、あなたはそれにあなたが好きなクラスに対応するTRを取得して割り当てるには、この要素の親を検索することができます。
$(".ui-datepicker-today").parent().addClass(...)

+0

親要素がにcorresspondingされた場合、私は知りません。 – David

+0

親要素は緑で強調表示された行を含む ''です。 firebugやその他の開発ツールを使用して、youreslfのHTMLマークアップをチェックすることをお勧めします。 –

+0

私はfirebugを使ってhtmlをチェックアウトしました。私は毎週のように区切られていることを理解しています。私は何をしようとしているのかをさらに説明するために投稿を編集しました。 – David

関連する問題