jquery добавить дополнительные элементы формы

Question

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

У нас есть форма, которая выглядит так. (Обратите внимание, я только изображающую часть из нашей зоны контакта)

<form> 
<div id="numbers"> 
<input id="no1" value="" class="phone" type="numbers"/> 
</div> 
</form> 

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

Мне тогда нужно разработать лучший способ их хранения, любые предложения?

Мое мышление было объединить их в следующие

025555555,0311555445,044585522 

Answer 1

1. Вам нужно имя на этом поле или форма не будет представить его с должности. Получаются только входные данные с именами. _{Если вы, конечно, не отправляете через AJAX и сами создаете данные о постах.}
2. Не храните данные в виде значений, разделенных запятой. Храните отдельную таблицу для телефонных номеров и используйте отношения «один ко многим» между человеком и их номерами телефонов. Нормализованные данные (почти) всегда правильные пути.
3. Вам действительно нужны неограниченные номера телефонов? Или достаточно небольшого фиксированного номера? Скажем, телефон, альтернативный телефон и ячейка? Если 3 будет делать, почему бы просто не создать три текстовых поля и сделать последние два необязательными?
4. Вы можете использовать что-то вроде следующего:

Пример:

$(function() { 
    $(document).on('blur','[name="phone"]', function() { 
     var $phones = $('[name="phone"]'), 
      empty = $phones.filter(function() { return !$(this).val(); }).length; 
     if (empty == 0) { // don't add a new one unless they all have values 
      $phones.filter(':last').after('<input type="text" name="phone" class="phone" type="numbers" />'); 
     } 
    }); 
}); 

Answer 2

Попробуйте демо - http://jsfiddle.net/cAMAe/2/

$('#numbers input').last().keypress(function() { 
    if($('#numbers input').last().val().length > 5) 
    { 
    $(this).clone('false').appendTo("#numbers"); 
    $('#numbers input').last().val(''); 
    } 
}); 

Просто измените идентификатор класса. Если по какой-то причине вы не можете удалить идентификатор сделать на следующие внутри, если блок

$input = $('#numbers input').last(); 
$input.clone(false).find("*").attr("id",$input.attr("id")+'111').attr('value','').appendTo("#number"); 

Answer 3

То, что я думаю, как это:

register(1); 
function register(i) 
{ 
    $('#no'+i).blur(function() 
    { 
     if($('#no'+i).val().get().matches(reg)) 
     { 
      generated_id="#no"+++i; 
      $('#numbers').append('<div><input type="text" id='+generated_id+'...></div>') 
      register(i); 
     } 
    }) 
}