Несколько сборщиков данных в одной форме

Question

Несколько сборщиков данных в одной форме Проверьте мою скрипку.

http://jsfiddle.net/83xzT/1/

У меня есть форма, добавляющая дополнительные строки по мере необходимости, и я могу заставить палитру работать на первом входе. Однако моя попытка добавить дополнительные входные данные для каждого с использованием счетчика i и добавления имени экземпляра не работает.

любые мысли или предложения будут оценены.

Answer 1

Простое исправление, просто двигай

$("#datepicker" + i).datepicker();

в

 $('#add').click(function() {
   ....
 }

блок, прямо над i ++; Далее нужно избавиться, если блокирует ваш if / else, и просто запустить его

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

на document.ready.

Answer 2

Fixed. http://jsfiddle.net/83xzT/8/

    var i = 1;
$( "#datepicker" ).datepicker();

$('#add').click(function() {
    $('<div><span class="fieldset"><input type="text" name="date[]" class="field" id="datepicker' + i + '" value=""/> <select class="field" name="time[]"><option value="NULL">---Select Time ---</option><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option></select> <select class="field" name="timeframe[]"><option value="NULL">---Select A.M/P.M. ---</option><option value="am">A.M.</option><option value="pm">P.M.</option></select><input type="hidden" name="breaker[]" class="field" value=";"/></span></div>').fadeIn('slow').appendTo('.inputs');
        if(i >= 1) {
            $( "#datepicker" + i ).datepicker();
        }
    i++;
});

Answer 3

Просто используйте класс вместо идентификатора в поле:

<input type="text" name="date[]" class="field" class="datepicker" value=""/>

Затем измените свою функцию добавления следующим образом:

$('#add').click(function() {
    $('... html tags ...').appendTo('.inputs').fadeIn('slow', function() {
       $(".datepicker").datepicker();
    });
    i++;
});

Answer 4

Вам просто нужно добавить $("#datepicker" + i).datepicker(); внутри функции щелчка

DEMO