JQuery datepicker без ввода

У меня довольно сложное веб-приложение, которое я бы хотел добавить к пользовательскому интерфейсу выбора даты.

Проблема, с которой я сталкиваюсь, заключается в том, что мне не удалось выяснить из документов, как реально контролировать, как и когда появляется датапикер. Элементы формы не включены (и нет, я не собираюсь добавлять секретное поле формы), поэтому простой и простой подход "без коробки" просто не будет работать.

Я надеюсь, что кто-то может дать небольшое руководство по шаблону, который позволяет мне программно вызывать datepicker. Я считаю, что знаю, как использовать пользовательские события datepicker для инициализации и позиционирования, а также для восстановления выбранного значения, когда пользователь его отклонит. Мне просто сложно создать экземпляр datepicker, так как я не свяжу его с элементом.

Здесь что не работает:

function doThing(sCurrent, event) { // sCurrent is the current value; event is an event I'm using for positioning information only
    var bIsDate = !isNaN( (new Date(sCurrent)).getTime() );

    jQuery.datepicker('dialog',
        (bIsDate ? new Date(sOriginal) : new Date()), // date
        function() { console.log('user picked a date'); }, // onSelect
        null, // settings (i haz none)
        event // position
    );

}

Причина в том, что "jQuery.datepicker" не является функцией. (Я делаю это неправильно.)

Я не женат на "диалоговом" подходе - это было всего лишь мое предположение, что вы вызываете его без ссылки на элемент формы.

Я использую jQuery 1.4.3 и jQueryUI 1.8.6

Ответы

<script>
    $(function() {
        $( "#datepicker" ).datepicker();
    });
</script>


<div class="demo">
    Date: <div id="datepicker"></div>
</div><!-- End demo -->

<input type="hidden" id="yourField" />

$("#yourField").datepicker({
        buttonImage: '../yourImage.png',
        buttonImageOnly: true,
        changeMonth: true,
        changeYear: true,
        showOn: 'both',
     });