更新

Question

你好开发人员我正在使用java脚本函数动态创建2个文本框和1个选择框...现在我想将创建的（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。不要使用计数器，除非你绝对必须（它们只是bug的来源）。这是一个简单的例子：

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 />字段的顺序将是通过$_POST向PHP提供的顺序。这段代码......

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

...将按照添加的顺序处理每个字段。您甚至可以使用JavaScript来重新排序或删除输入，这些将反映在$_POST中。此方法与JSON编码相结合，可以快速简便地处理多输入，自由格式的字段。

更新

将上述代码应用于您的用例需要一些可能不明显的小添加。你需要为三个输入（stop，timing和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
}

如何将动态创建的输入框的值插入数据库

3 个答案:

更新