web-dev-qa-db-ja.com

jqueryui datepickerインラインモードで選択した日付を取得する

Jqueryui datepickerを使用しようとしています。インラインモードを使いたい。

ユーザーが日付を選択したときに、選択した日付を取得する方法を知りたいです。入手先と入手方法は？

jquery-uicalendar
21
Shyju

GetDate関数を使用して日付を取得できます。

$("#datepicker").datepicker( 'getDate' );

値はJavaScript Dateオブジェクトとして返されます。

ユーザーが日付を選択するときにこの値を使用する場合は、onSelectイベントを使用できます。

$("#datepicker").datepicker({
   onSelect: function(dateText, inst) { 
      var dateAsString = dateText; //the first parameter of this function
      var dateAsObject = $(this).datepicker( 'getDate' ); //the getDate method
   }
});

この場合、最初のパラメーターは、選択された日付としての文字列です。 parseDate を使用して、JS Dateオブジェクトに変換します。

JQuery UI DatePickerの完全なリファレンスについては、 http://docs.jquery.com/UI/Datepicker を参照してください。

63
Tim Van Laer
$(document).on("change", "#datepickerdiv", function () {
         alert($(this).val())


    })

これは、jqueryで最も簡単な答えです。

19
Chris Stewart

私はclose eventを操作しようとしましたが、カレンダーが開いていて画面のどこかをクリックしたときにもトリガーされていました。最終的にカレンダーはfocusを失い、呼び出したclose eventを失います。だから私はこれを見つけました。

  onClose: function (dateText, inst) {
            function isDonePressed() {
                return ($('#ui-datepicker-div').html().indexOf('ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all ui-state-hover') > -1);
            }
            if (isDonePressed()) {
                var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
                var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
                $(this).datepicker('setDate', new Date(year, month, 1));
            }
        }
1
Baqer Naqvi