3

入力の値として設定するために、datepicker のボタンテキスト (デフォルトでは省略記号) を取得しようとしています。

ページに複数の日付ピッカーがあり、以下の例とは異なり、テキスト入力の代わりにアイコンがあります。アイコンの上にカーソルを置いたときに表示されるツールチップに値自体を表示したいと思います。

私は試しました-buttonText: $(this).val()オプションとして、何も拾いません

例 - http://jsbin.com/unolot/3/

私の質問- 日付ピッカー入力のボタンテキストを動的に値と一致させるにはどうすればよいですか?

4

1 に答える 1

3

次の2つのケースを処理する必要があります。

  • 選択した日付が変更された場合:onSelectイベントを使用してボタンのタイトル属性を変更します
  • 初期レンダリング時:残念ながら、datepickerはウィジェットファクトリを(まだ)実装していないため、イベントは発生しません。ウィジェットが初期化された後、createtitle属性を手動で更新する必要があります。

ピッカーのデフォルトの日付をフィールドの初期値に設定することを忘れないでください。そうしないと、デフォルトで選択される日付は「今日」になります。

このようなもの:

// as you have several instances, loops through them
$(".deadline_picker_on").each(function() {

    var dt = $(this);

    dt.datepicker({
        showOn: "button",
        buttonText: '',
        // set the default date to the value of the field
        defaultDate: dt.val(),
        duration: 100,
        dateFormat: 'yy-mm-dd',
        showOptions: {
            direction: 'right'
        },
        onSelect: function(dateText, inst) {
            // on data selection, change the title attribute of the button
            $(this).next().attr('title', dateText);
        }
    })
    // get the button (next element)
    .next()
    // set the title attribute with the formatted initial date from the picker
    .attr('title', $.datepicker.formatDate('yy-mm-dd', dt.datepicker('getDate')));
});
​
于 2012-06-07T11:06:18.917 に答える