jquery datepicker несколько экземпляров

Я сделал форму RequestForQuote, в которой я даю возможность добавлять новые позиции для получения RFQ.

В основном это довольно легко сделать с помощью PHP в моем случае. Работать очень хорошо. Вы можете посмотреть. Его можно найти по адресу: мой сайт.

Теперь я заразился jquery-вирусом и просто хотел добавить пользовательский интерфейс datepicker (последняя версия, которую я получил с их веб-страницы).

<input type="text" size="10" id="deldate[] 
     class="datepicker" value="<?php echo $_REQUEST['deldate'][$k]; ?>" />

$k из цикла php for($k=0;$k<=$NoPos;$k++)

работа с кодом javascript выглядит так:

$(function() {
$('input').filter('.datepicker').datepicker({
        showOn: 'button', 
        buttonImage: 'calender/media/cal.gif', 
        buttonImageOnly: true,
        firstDay: 1,
        dateFormat: 'yy-mm-dd', 
        minDate: 0, maxDate: '+4Y'});

}); 

В браузере это выглядит довольно красиво, появляется пользовательский интерфейс, я не могу выбрать дату.

НО...

если я добавлю еще одну позицию в форму, что делается через PHP, поэтому мне нужно отправить форму для подсчета $NoPos, ранее вставленные даты будут потеряны, и у меня будет пустое поле ввода.

теперь с помощью onSubmit: function(dateText) я могу получить выбранную дату. Однако мне не удается получить доступ к правильному полю ввода, чтобы ввести дату.

Итак, мой вопрос прост: что я делаю неправильно? Если все в порядке, то кто-нибудь, пожалуйста, скажите мне, как я могу решить эту проблему.

У меня есть мысль о чем-то вроде:

for (var i=0;i<=NoPos;i++) {
    var tag = "#deldate"+i;
    $(tag).datepicker({ ... });
}

и используя php для <input type="text" size="10" id="lieferdat<?php echo $k; ?>" class="datepicker" />

Большое спасибо за ваше предполагаемое терпение, чтобы прочитать это...

и многое другое спасибо за любые подсказки

Ура Даниэль


person Daniel    schedule 06.06.2009    source источник


Ответы (3)


я сам искал то же самое и, кажется, нашел хитрость: $('input').filter('.datepickerclass').datepicker()
и соответствующие элементы ввода:
class="datepickerclass"

Я вижу выше, что вы пробовали что-то подобное, но у меня сработало простое следование рецепту (по этой ссылке).

person Ingvald    schedule 08.07.2009

Я не думаю, что проблема заключается в средстве выбора даты. Средство выбора даты используется только для заполнения поля ввода датой, оно не должно иметь ничего общего с полями формы, которые отправляются на сервер. В любом случае, только один элемент выбора даты (div) фактически размещается на странице, независимо от того, сколько динамических средств выбора даты вы фактически используете. Можете ли вы опубликовать соответствующий сгенерированный HTML для страницы?

Кстати, похоже (по крайней мере, в вашем примере кода) вам не хватает кавычки в идентификаторе. Если это в реальном коде, это может быть причиной вашей проблемы.

EDIT: на основании вашего опубликованного примера (который действительно должен был быть добавлен к вашему вопросу путем его редактирования, а не добавления в качестве ответа на него), я вижу вашу проблему. Ваш ввод не имеет параметра имени. Входные данные отправляются обратно только в том случае, если у них есть имя.

Измените это:

<input type="text" size="10"
       id="lieferdat<?php echo $k; ?>"
       class="datepicker" />

к этому:

<input type="text" size="10"
       id="lieferdat<?php echo $k; ?>"
       name="lieferdat<?php echo $k; ?>"
       class="datepicker" />
person tvanfosson    schedule 06.06.2009
comment
Я согласен, что это не вина jquery, а моя неопытность в этой области. Я разместил html-код. Спасибо еще раз! - person Daniel; 07.06.2009
comment
Вы были правы, что параметр имени отсутствовал. Я исправил это, но без изменений. Тем не менее, как только я добавляю еще один pos, т.е. отправляю форму (либо с помощью POST, либо GET), все значения присутствуют, кроме дат, которые я ввел... - person Daniel; 07.06.2009
comment
Вчера я был довольно многоуровневым, поэтому я начал сегодня с нуля. Результат: если я использую прямой указатель, такой как $('#lieferdat').datepicker(), он работает нормально. дата остается после перезагрузки страницы. Ну, я мог бы пойти и разместить 20 идентификаторов и ограничить вход этим числом (обычно заказчику не нужно больше 10). Однако я был бы более удовлетворен, если бы сделал это динамически. Что ж, я выложу результат, если я смогу справиться с этим однажды. Еще раз спасибо за поддержку!! Привет, Даниэль - person Daniel; 07.06.2009

Это может быть немного поздно, но все приведенные выше предложения не сработали для меня, я придумал простое решение для этого.

Во-первых, что вызывает проблему: JQuery назначает datepicker идентификатору элемента. если вы клонируете элемент, то тот же идентификатор также может быть клонирован. что jQuery не нравится. Вы можете получить либо ошибку нулевой ссылки, либо дату, назначенную первому полю ввода, независимо от того, какое поле ввода вы нажимаете.

Решение:

1) уничтожить средство выбора даты 2) назначить новые уникальные идентификаторы для всех полей ввода 3) назначить средство выбора даты для каждого ввода

Убедитесь, что ваш ввод примерно такой

<input type="text" name="ndate[]" id="date1" class="n1datepicker">

Прежде чем клонировать, уничтожьте средство выбора даты

$('.n1datepicker').datepicker('destroy');

После клонирования добавьте и эти строки

var i = 0;
$('.n1datepicker').each(function () {
    $(this).attr("id",'date' + i).datepicker();
    i++;
});

и происходит волшебство

person EGN    schedule 17.06.2013