Получить данные из клонированного элемента

0

У меня проблема. В моей форме у меня есть div

<div class="wyksztalcenie">
<select id="szkola">
    <option value="Wyższe">Wyższe</option>
    <option value="Średnie">Średnie</option>
    <option value="Zawodowe">Zawodowe</option>
</select> 
<input class="cos1" id="nazwa" name="nazwaszkoly" placeholder="nazwa uczelni/szkoły" type="text" /> 
<input class="cos1" id="kierunek" name="kier" placeholder="kierunek" type="text" /> 
<input class="cos1" id="rok" name="rok" placeholder="rok ukończenia" type="text" />
</div>

Я клонировал этот div пять раз, и моя проблема - получить данные от ввода и выбрать в клонированном div. В этом пользователе выберите уровень образования (средняя школа, колледж и т.д.), А затем отправлю его в базу данных в формате "Select-input-input-input". Это нормально, но только первый div хранится в базе данных. Может кто-нибудь мне помочь

  • 0
    И что ты пытался для этого?
  • 1
    Не зная, что вы пытались, мы не знаем, какую проблему вы пытаетесь решить.
Показать ещё 1 комментарий
Теги:

3 ответа

0
Лучший ответ

Я имитирую вашу проблему;

HTML (я предполагаю, вы уже клонировали его):

<div class="wyksztalcenie">
<select class="szkola">
    <option value="Wyższe">Wyższe</option>
    <option value="Średnie">Średnie</option>
    <option value="Zawodowe">Zawodowe</option>
</select> 
<input class="cos1" id="nazwa" name="nazwaszkoly" placeholder="nazwa uczelni/szkoły" type="text" /> 
<input class="cos1" id="kierunek" name="kier" placeholder="kierunek" type="text" /> 
<input class="cos1" id="rok" name="rok" placeholder="rok ukończenia" type="text" />
</div>
<div class="wyksztalcenie">
<select class="szkola">
    <option value="Wyższe">Wyższe</option>
    <option value="Średnie">Średnie</option>
    <option value="Zawodowe">Zawodowe</option>
</select> 
<input class="cos1" id="nazwa" name="nazwaszkoly" placeholder="nazwa uczelni/szkoły" type="text" /> 
<input class="cos1" id="kierunek" name="kier" placeholder="kierunek" type="text" /> 
<input class="cos1" id="rok" name="rok" placeholder="rok ukończenia" type="text" />
</div>
<div class="wyksztalcenie">
<select class="szkola">
    <option value="Wyższe">Wyższe</option>
    <option value="Średnie">Średnie</option>
    <option value="Zawodowe">Zawodowe</option>
</select> 
<input class="cos1" id="nazwa" name="nazwaszkoly" placeholder="nazwa uczelni/szkoły" type="text" /> 
<input class="cos1" id="kierunek" name="kier" placeholder="kierunek" type="text" /> 
<input class="cos1" id="rok" name="rok" placeholder="rok ukończenia" type="text" />
</div>
<div class="wyksztalcenie">
<select class="szkola">
    <option value="Wyższe">Wyższe</option>
    <option value="Średnie">Średnie</option>
    <option value="Zawodowe">Zawodowe</option>
</select> 
<input class="cos1" id="nazwa" name="nazwaszkoly" placeholder="nazwa uczelni/szkoły" type="text" /> 
<input class="cos1" id="kierunek" name="kier" placeholder="kierunek" type="text" /> 
<input class="cos1" id="rok" name="rok" placeholder="rok ukończenia" type="text" />
</div>

<input type="button" id="send" value="Send"/>

JS:

$("#send").on("click", function() {
    var html ="";
    var counter = 1;
    $('.wyksztalcenie').each(function() {
        var selectValue = $(this).find('select').val();

        var inputOne = $(this).find('#nazwa').val();
        var inputTwo = $(this).find('#kierunek').val();
        var inputThree = $(this).find('#rok').val();

        html += "select-" + counter + "=" + selectValue + "&input-" + counter + "=" + inputOne + "&input-" + counter + "=" + inputTwo + "&input-" + counter + "=" + inputThree;
        html += "&";
        counter++;
    });
    html = html.substring(0, html.length-1);

    // Send data here
});

Здесь вы можете увидеть рабочую демонстрацию: http://jsfiddle.net/4egzF/

Примечание. Обновите идентификатор selectbox до класса. Идентификатор должен быть уникальным

Поделиться
  • 0
    Спасибо за помощь !! :) Это решило мою проблему
  • 0
    @ Томек, если он решил твою проблему, прими мой ответ и прими мой ответ. Спасибо
0

Предполагая пять идентичных копий кода выше, что-то вроде этого должно работать, где вы ссылаетесь на каждый экземпляр .wyksztalcenie по индексу:

// selects the first (index zero) instance of the cloned div
// substitute 1-4 for the zero to get the others
//
$('.wyksztalcenie').eq(0).find('select').val();

Если вы хотите просмотреть их все, используйте each():

$('.wyksztalcenie').each(function() {
    var myVal = $(this).find('select').val();
    // do something with myVal
});
Поделиться
  • 0
    что если я хочу значение пятого клонированного div?
  • 0
    Смотрите комментарии, которые я добавил.
Показать ещё 4 комментария
0

Добавьте атрибут name в элемент select и замените все атрибуты id class. Тогда все атрибуты имени должны иметь [] добавленные к ним (пример: kier[]).

Затем вы можете найти все пять из них в массиве на вашей странице обработки.

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню