Как вставить значение динамически созданных полей ввода в базу данных

Question

Привет разработчикам Я создаю 2 текстовых поля и 1 окно выбора динамически с помощью java-скрипта ... теперь я хочу опубликовать значение полей (n), созданных в базу данных (соответствующая таблица) , как я использую CodeIgniter так м разместить скрипт и код

это простой Java-скрипт, который я использую

<script> 
    var counter=1; 
    function generateRow() { 
    var count="<font color='red'>"+counter+"</font>"; 
    var temp ="<p>&nbsp;&nbsp;&nbsp;&nbsp;<div class='_25'><input type='textbox' id='textbox' name='stop"+counter+"' placeholder='Stop Name'></input></div>&nbsp;&nbsp;&nbsp;<div class='_25'><input type='textbox' id='textbox' name='timing"+counter+"' placeholder='Timing'></input></div>&nbsp;<div class='_25'><select id='ampm"+counter+"' name='ampm"+counter+"'><option>a.m</option><option>p.m</option></select> </div>"; 

    var newdiv = document.createElement('div'); 
    newdiv.innerHTML = temp + count; 

    var yourDiv = document.getElementById('div'); 
    yourDiv.appendChild(newdiv); 
    counter++; 
    } 
</script> 

и это мое деление на PHP файл

<div id="div"> 
</div> 

<p>&nbsp;</p> 
<div class="_25"> 
    <p> 
     <input type="button" name="button" class="button red" id="button" value="Add" onclick="generateRow() "/></a> 
    </p> 
</div> 
<input type='button' value='Remove Button' id='removeButton'> 

и это мои связанные поля таблицы

route_number stop_name am_pm timing 

Answer 1

Мой любимый способ сделать это состоит в использовании DOM как можно больше. Не используйте счетчики, если вам абсолютно не нужно (они всего лишь источник ошибок). Вот простой пример:

HTML/JS/JQuery (может меняться, я созданного это, чтобы сделать его легко следовать):

<form method="POST" id="theForm"> 
    <div id="fields"> 
     <input type="text" name="fields[]"/> 
    </div> 
    <input type="button" id="addField" value="Add Field"/> 
</form> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#addField').click(function() { 
      $('#fields').append(
       $('<input type="text" name="fields[]"/>') 
      ); 
     }) 
    }); 
</script> 

Обратите внимание, как я не нужно использовать какой-либо подсчета переменной , Как и PHP, вы можете создать массив переменных POST без указания индексов с помощью [], и сервер (или браузер? Я не уверен) построит массив для вас. Порядок, в котором поля <input /> отображаются на странице, будет соответствовать порядку их предоставления на ваш PHP через $_POST. Этот код ...

foreach ($_POST['fields'] as $fieldIndex => $fieldValue) { 
    doStuff($fieldValue); 
} 

... будет обрабатывать каждое поле в том порядке, в котором они были добавлены. Вы даже можете использовать JavaScript для повторно заказать или удалить входы и что будет отражено в $_POST. Этот метод, в сочетании с кодированием JSON, позволяет быстро и легко обрабатывать поля ввода с несколькими входами.

Update:

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

<form method="POST" id="theForm"> 
    <div id="fields"> 
     <input type="text" name="fields[stop][]"/> 
     <input type="text" name="fields[timing][]"/> 
     <select name="fields[ampm][]"> 
      <option value="am">AM</option> 
      <option value="pm">PM</option> 
     </select> 
     <br/> 
    </div> 
    <input type="button" id="addField" value="Add Field"/> 
</form> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#addField').click(function() { 
      $('#fields').append(
       $('<input type="text" name="fields[stop][]"/>'), 
       $('<input type="text" name="fields[timing][]"/>'), 
       $('<select name="fields[ampm][]"><option value="am">AM</option><option value="pm">PM</option></select>'), 
       $('<br/>') 
      ); 
     }) 
    }); 
</script> 

Заполнение этой формы с некоторыми тестовыми данными дает следующий массив:

[fields] => Array 
(
    [stop] => Array 
     (
      [0] => aaa 
      [1] => bbb 
     ) 

    [timing] => Array 
     (
      [0] => 1111 
      [1] => 2222 
     ) 

    [ampm] => Array 
     (
      [0] => am 
      [1] => pm 
     ) 

) 

и обрабатывать, что в PHP требует простой старой школы цикл:

$numFields = count($_POST['fields']['stop']); 

for ($i = 0; $i < $numFields; $i++) { 

    // Pack the field up in an array for ease-of-use. 
    $field = array(
     'stop' => $_POST['fields']['stop'][$i], 
     'timing' => $_POST['fields']['timing'][$i], 
     'ampm' => $_POST['fields']['ampm'][$i] 
    ); 

    saveToDatabase($field); 
} 

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

Answer 2

имя вашего динамического поля ввода "stop["+counter+"]" (с помощью фигурных скобок, как часть имени) вместо того, чтобы добавить счетчик в конце имени. Тогда в ваших данных сообщения $_POST['stop'] будет массивом значений, которые вы можете просто перебрать цикл с помощью счетчика в качестве ключа в подматрице. И $_POST['stop'][1] будет соответствовать $_POST['timing'][1] ... и т. Д.

Answer 3

Вы можете построить следующий HTML input поля:

<input type="text" name="data[]" /> 
<input type="text" name="data[]" /> 
<input type="text" name="data[]" /> 
// ... 

что приведет к массиву ключ data в $ _REQUEST супер глобального, когда вы var_dump($_REQUEST['data']). Попробуйте. Вам даже не нужно индексировать массив data[], так как PHP сделает это за вас.

Вы можете обработать $_REQUEST['data'] или $_POST['data'] массив с конструкцией в foreach петли:

foreach($_REQUEST['data'] as $data){ 
    // $data is the corresponding input field's value 
}