使用codeigniter动态添加表单中的字段

时间:2014-09-16 22:33:39

标签: javascript php codeigniter dynamic-forms

我在codeigniter中调整了这个指南:http://www.quirksmode.org/dom/domform.html,为了创建一个包含动态字段的表单,所有功能都运行良好,但是当我尝试用我的控制器回显数据时:

echo '<pre>'.print_r($this->input->post(),TRUE).'</pre>';

它只打印视图中添加的最后一组值。

Example

这是js函数:

var counter = 0;
function init() {
  document.getElementById('moreFields').onclick = moreFields;
}

function moreFields() {
  counter++;
  var newFields = document.getElementById('readroot').cloneNode(true);
  newFields.id = '';
  newFields.style.display = 'block';
  var newField = newFields.childNodes;
  for (var i=0;i<newField.length;i++) {
    var theName = newField[i].name
    if (theName)
      newField[i].name = theName + counter;
  }
  var insertHere = document.getElementById('writeroot');
  insertHere.parentNode.insertBefore(newFields,insertHere);
}

以下是表单代码:

<?php echo form_open('admin/grabar_ruta'); ?>
   <table width="100%">
    <tr>
      <td width="12%" align="right">Fuente:</td>
      <td width="13%" align="left"><select name="fuente"> 
      <?php foreach($fuentes as $row) { echo '<option value="'.$row->id.'">'.$row->serial.'</option>'; } ?> </select></td>
      <td width="12%" align="right">Vehículo:</td>
      <td width="13%" align="left"><select name="vehiculo"> 
      <?php foreach($vehiculos as $row) { echo '<option value="'.$row->id.'">'.$row->placa.'</option>'; } ?> </select></td>
      <td width="12%" align="right">Conductor:</td>
      <td width="13%" align="left"><select name="conductor"> 
      <?php foreach($conductores as $row) { echo '<option value="'.$row->id.'">'.$row->nombre.'</option>'; } ?> </select></td>
       <td width="12%" align="right">Fecha:</td>
      <td width="13%" align="left"><input type="date" name="name[]"></td>
    </tr>
    </table> 
    <div id="readroot" >

<table width="100%">
    <tr>
      <td width="12%" align="right">Origen:</td>
      <td width="13%" align="left"><input type="text" name="origen" size="12"></td>
      <td width="12%" align="right">Hora Salida:</td>
      <td width="13%" align="left"><input type="time" name="hora_salida"></td>
      <td width="12%" align="right">Destino:</td>
      <td width="13%" align="left"><input type="text" name="destino" size="12"></td>
       <td width="12%" align="right">Hora Llegada:</td>
      <td width="13%" align="left"><input type="time" name="hora_llegada"></td>
    </tr>
  </table>
<input type="button" value="Eliminar"
    onclick="this.parentNode.parentNode.removeChild(this.parentNode);" /><br /><br /> 
</div>
  <span id="writeroot"></span>
  <input type="button" id="moreFields" value="Añadir ruta" />
  <input type="submit" value="Grabar Ruta" />  
<?php echo form_close(); ?>

1 个答案:

答案 0 :(得分:0)

哦,我可以解决我的问题,我只需要为视图中的动态组件使用数组名称:

<?php echo form_open('admin/grabar_ruta'); ?>
   <table width="100%">
    <tr>
      <td width="12%" align="right">Fuente:</td>
      <td width="13%" align="left"><select name="fuente"> 
      <?php foreach($fuentes as $row) { echo '<option value="'.$row->id.'">'.$row->serial.'</option>'; } ?> </select></td>
      <td width="12%" align="right">Vehículo:</td>
      <td width="13%" align="left"><select name="vehiculo"> 
      <?php foreach($vehiculos as $row) { echo '<option value="'.$row->id.'">'.$row->placa.'</option>'; } ?> </select></td>
      <td width="12%" align="right">Conductor:</td>
      <td width="13%" align="left"><select name="conductor"> 
      <?php foreach($conductores as $row) { echo '<option value="'.$row->id.'">'.$row->nombre.'</option>'; } ?> </select></td>
       <td width="12%" align="right">Fecha:</td>
      <td width="13%" align="left"><input type="date" name="fecha"></td>
    </tr>
    </table>

    <div id="readroot" >

<table width="100%">
    <tr>
      <td width="12%" align="right">Origen:</td>
      <td width="13%" align="left"><input type="text" name="origen[]" size="12"></td>
      <td width="12%" align="right">Hora Salida:</td>
      <td width="13%" align="left"><input type="time" name="hora_salida[]"></td>
      <td width="12%" align="right">Destino:</td>
      <td width="13%" align="left"><input type="text" name="destino[]" size="12"></td>
       <td width="12%" align="right">Hora Llegada:</td>
      <td width="13%" align="left"><input type="time" name="hora_llegada[]"></td>
    </tr>
  </table>
<input type="button" value="Eliminar"
    onclick="this.parentNode.parentNode.removeChild(this.parentNode);" /><br /><br /> 
</div>
  <span id="writeroot"></span>
  <input type="button" id="moreFields" value="Añadir ruta" />
  <input type="submit" value="Grabar Ruta" />
<?php echo form_close(); ?>