Динамическая генерация jQuery Datepicker с altFields - PullRequest
3 голосов
/ 07 сентября 2010

Я динамически генерирую средство выбора даты, просто добавляя поле HTML в div:

<input type="text" value="" readonly="readonly" name="tier[2][publication_date]" id="publication_date_2" size="10" maxlength="10" tabindex="6" class="publication_date hasDatepicker">
<input type="hidden" name="tier[2][publication_date_db]" id="publication_date_db_2" value="">

В связи с тем, как мы храним даты, у нас есть отдельное поле (altfield) для средства выбора даты, в котором хранятся нашидата в формате базы данных, выбранная пользователем.

Для обработки выбора нескольких средств выбора даты я назначаю класс и использую livequery для обнаружения onClicks после загрузки страницы:

$(".publication_date").livequery(function() {
                $(this).datepicker({
                    dateFormat: "dd M yy",
                    changeYear: true,
                    changeMonth: true,
                    onSelect: function(dateText, inst) {
                        console.log(inst);
                    }
                });
            });

Iесть проблема в том, как средство выбора даты знает, какое альтфилд нужно заполнить?На один указатель даты обычно включается:

altField: '#start_date_datepicker_altfield', 
altFormat: 'yy-mm-dd',

для населения.

Ответы [ 2 ]

5 голосов
/ 07 сентября 2010

Я знаю, что в документации сказано, что требуется селектор, но он также может принимать объект jQuery, поэтому просто используйте $(this).next(), чтобы получить скрытое поле, например:

$(".publication_date").livequery(function() {
   $(this).datepicker({
      altField: $(this).next(), 
      altFormat: 'yy-mm-dd',
      dateFormat: "dd M yy",
      changeYear: true,
      changeMonth: true,
      onSelect: function(dateText, inst) {
        console.log(inst);
      }
   });
});

Поскольку большинство плагинов сводятся к $(input), этот вход может быть селектором или объектом jQuery или элементом DOM, и он все равно будет работать просто отлично:

0 голосов
/ 07 сентября 2010

Я не использовал livequery, но, судя по всему, вы можете получить id соответствующего элемента из this.id.В вашем примере HTML это будет "публикация_даты_2", из которой относительно легко создать необходимый идентификатор для альтернативного поля "публикация_дата_db_2" (вы можете сделать это еще проще, изменив стратегию именования поля).

Так что возможно:

$(".publication_date").livequery(function() {
    $(this).datepicker({
        dateFormat: "dd M yy",
        changeYear: true,
        changeMonth: true,
        onSelect: function(dateText, inst) {
            console.log(inst);
        },
        altField: "#" + this.id.replace("_date_", "_date_db_"),
        altFormat: 'yy-mm-dd'
    });
});
...