Добавление полей в форму

Тема в разделе "JavaScript", создана пользователем danneo, 3 янв 2013.

Модераторы: ZiX
  1. danneo

    danneo Честный

    Регистр.:
    13 ноя 2007
    Сообщения:
    1.453
    Симпатии:
    113
    Задача не только с JS, но и с php немного...
    Нужно сделать в форме поля:
    1. телефоны
    2. факсы
    3. сот.телефоны
    Это разные типы. При нажатии на "Добавить номер", появляется поле "2. телефон" и т.д. Также и для факсов и для сот.телефонов.
    Каждый номер состоит из кода города и самого номера, таким образом это многомерный массив с 2 значениями в каждой ячейке:
    1. Телефоны:
    phone[0][0] = 099
    phone[0][1] = 7801223
    phone[1][0] = 099
    phone[1][1] = 7181438
    2. Факсы:
    и т.д.
    Вроде правильно массив написал :)
    Как это сделать правильно, подскажите, пожалуйста?
    Нашел пример:
     
  2. polyetilen

    polyetilen Заблокирован

    Регистр.:
    10 авг 2006
    Сообщения:
    814
    Симпатии:
    474
    С полями полей делать ничего не надо, так и записывать название поля phone[1][0]
    HTML:
    
    Код: <input name="phone[1][0]" value="099" />
    Телефон: <input name="phone[1][1]" value="7181438" />
    
    а для добавление поля, например подсчитать сколько полей уже есть, поделить на два, потому что два поля на телефон, это будет индекс массива, и подставить html код поля.
    С jquery:
    HTML:
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="UTF-8" />
    <title>Dynamic form</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     
    </head>
        <body>
            <form method="post" action="">
                    <div id="phones">
                        1. Код: <input name="phone[0][0]" value="099" /> Телефон: <input name="phone[0][1]" value="7181438" />
                    </div>
                    <a href="#" onclick='var n = ($("#phones input").length/2); $("#phones").append("<br />" + (n + 1) + ". Код: <input name=\"phone["+ n +"][0]\" value=\"\" /> Телефон: <input name=\"phone["+ n +"][1]\" value=\"\" />");return false;'>Добавить поле для телефона</a>
            </form>
        </body>
    </html>