0

日付ピッカーが 2 つあります。ページに最初に表示されるとき、範囲の最大値と最小値は今日に設定されているため、日付を選択できません。ドロップダウンの選択に基づいて、有効な日付範囲が両方のカレンダーに設定されます。TO 日付ピッカーで TODAY をデフォルトの日付として選択し、FROM 日付ピッカーでは何も選択しないようにします。他の選択された日付であるかのように TODAY を強調するために、少し CSS を追加しました。この時点で、TO カレンダーはすべて順調です。ただし、FROM カレンダーでは TODAY が選択されたかのように表示されますが、実際には現時点で日付は選択されていません。問題は、datepicker の日付を「null」に設定しても、今日の日付が ui-datepicker-current-date および ui-datepicker-today としてマークされているようです。ui-datepicker-today としてマークされていても問題ありません。なぜなら、それは今日だからです。ui-datepicker-current-date としてもマークされているため、TO カレンダーで選択されていない日付と、ユーザーが実際に選択した日付を区別する方法がありません。

誰かがこれを機能させる方法を考え出しましたか? ユーザーが選択した日付と選択されていない日付に追加されたセレクターは同じように見えます。どちらも今日と現在の日付でマークされ、どちらも ui-active です。

完全に迷っている場合は、明日正確なコードを投稿できます。今は仕事で、家で調べています。あなたが提供できる助けを前もってありがとう！

4

1 に答える 1

0

これに予定よりも多くの時間を費やしたので、最終的な解決策を共有します。

datePicker が今日を現在選択されている日付としてマークし、選択された日付のない datePicker を効果的に防止するという事実にはまだ満足していませんが、それでも機能させる必要がありました。これが私が追加した CSS です。jquery テーマ CSS の後にある限り、これを別のファイルとして含めることも、好きなように含めることもできます。

.ui-datepicker-current-day .ui-state-active { border: 1px solid #000; background: #bebbbb url(images/ui-bg_glass_65_bebbbb_1x400.png) 50% 50% repeat-x; font-weight: normal; color: #212121; outline: none; }

これは基本的に、今日のこの日に適用されたすべてのスタイルを上書きし、他の選択された日とまったく同じように見えます。次は、デフォルトの日付が選択されて表示されないようにする JavaScript です。

$("#nameOfDatePickerDiv").find("td.ui-datepicker-current-day").find("a:first-child").removeClass('ui-state-active');

まず、有効な範囲が設定された後、ユーザーが自分で選択できるようになる前に、これが行われます。現在の td を見つけ、最初で唯一の a を見つけて、そのアクティブさを取り除きます。これで、現在の日付 (デフォルトは今日) を持つカレンダーが作成されましたが、ユーザーが事前に選択されていると思い込ませることはありません。自分で選択すると、ui-state-active クラスがその日付に追加されます。更新されたスタイルを使用し、この JS を使用しない場合、今日は常に事前に選択されているかのように表示されます。

誰かがより良い方法を見つけたら、遠慮なく共有してください。私はこれにあまりにも多くの時間を費やしましたが、もっと明白なことを見逃しても驚かないでしょう.

于 2010-03-19T18:55:54.477 に答える