Question

我在用户点击添加更多内容时可以添加多个设备但是如何为这个表单中的每个设备组合多个与数组同名的字段，我的服务器端语言是PHP。

<form>
<div class="row">
  <div class="col-md-12">
    <div class="widget stacked">
      <div class="widget-header">
        <i class="icon-hdd"></i>
        <h3>Remove Devices</h3> <a class="btn label label-success add_new_device">Add more</a>
      </div>
      <div class="widget-content">
        <div class="form-group">
          <label for="device_name">Device Name</label>
          <input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[device_name][]" type="text">
        </div>
        <div class="form-group">
          <label for="device_description">Device Description</label>
          <input class="form-control" data-validation="length" data-validation-length="max255" data-validation-optional="true" name="device[device_description][]" type="text">
        </div>
        <div class="form-group">
          <label for="device_url">Device Url</label>
          <input class="form-control" data-validation="url" data-validation-optional="true" data-validation-help="Ex: http://000.000.000.000/index.cgi" name="device[device_url][]" type="url">
        </div>
        <div class="form-group">
          <label for="device_ip4">IP4</label>
          <input class="form-control" data-validation="length" data-validation-length="max15" data-validation-optional="true" data-validation-help="Ex: 000.000.000.000" name="device[device_ip4][]" type="text">
        </div>
        <div class="form-group">
          <label for="device_ip6">IP6</label>
          <input class="form-control" data-validation="length" data-validation-length="max45" data-validation-help="Ex: 0000:0000:0000:0000:0000:0000" name="device[][device_ip6]" type="text">
        </div>
        <div class="form-group">
          <label for="device_username">Device Username</label>
          <input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[][device_username]" type="text">
        </div>
        <div class="form-group">
          <label for="device_password">Device Password</label>
          <input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[][device_password]" type="text">
        </div>
      </div>
    </div>
  </div>
</div>

<div class="row">
  <div class="col-md-12">
    <div class="widget stacked">
      <div class="widget-header">
        <i class="icon-hdd"></i>
        <h3>Remove Devices</h3> <a class="btn label label-success add_new_device">Add more</a>
      </div>
      <div class="widget-content">
        <div class="form-group">
          <label for="device_name">Device Name</label>
          <input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[device_name][]" type="text">
        </div>
        <div class="form-group">
          <label for="device_description">Device Description</label>
          <input class="form-control" data-validation="length" data-validation-length="max255" data-validation-optional="true" name="device[device_description][]" type="text">
        </div>
        <div class="form-group">
          <label for="device_url">Device Url</label>
          <input class="form-control" data-validation="url" data-validation-optional="true" data-validation-help="Ex: http://000.000.000.000/index.cgi" name="device[device_url][]" type="url">
        </div>
        <div class="form-group">
          <label for="device_ip4">IP4</label>
          <input class="form-control" data-validation="length" data-validation-length="max15" data-validation-optional="true" data-validation-help="Ex: 000.000.000.000" name="device[device_ip4][]" type="text">
        </div>
        <div class="form-group">
          <label for="device_ip6">IP6</label>
          <input class="form-control" data-validation="length" data-validation-length="max45" data-validation-help="Ex: 0000:0000:0000:0000:0000:0000" name="device[][device_ip6]" type="text">
        </div>
        <div class="form-group">
          <label for="device_username">Device Username</label>
          <input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[][device_username]" type="text">
        </div>
        <div class="form-group">
          <label for="device_password">Device Password</label>
          <input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[][device_password]" type="text">
        </div>
      </div>
    </div>
  </div>
</div>

<div class="row">
  <div class="col-md-12">
    <div class="widget stacked">
      <div class="widget-header">
        <i class="icon-hdd"></i>
        <h3>Remove Devices</h3> <a class="btn label label-success add_new_device">Add more</a>
      </div>
      <div class="widget-content">
        <div class="form-group">
          <label for="device_name">Device Name</label>
          <input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[device_name][]" type="text">
        </div>
        <div class="form-group">
          <label for="device_description">Device Description</label>
          <input class="form-control" data-validation="length" data-validation-length="max255" data-validation-optional="true" name="device[device_description][]" type="text">
        </div>
        <div class="form-group">
          <label for="device_url">Device Url</label>
          <input class="form-control" data-validation="url" data-validation-optional="true" data-validation-help="Ex: http://000.000.000.000/index.cgi" name="device[device_url][]" type="url">
        </div>
        <div class="form-group">
          <label for="device_ip4">IP4</label>
          <input class="form-control" data-validation="length" data-validation-length="max15" data-validation-optional="true" data-validation-help="Ex: 000.000.000.000" name="device[device_ip4][]" type="text">
        </div>
        <div class="form-group">
          <label for="device_ip6">IP6</label>
          <input class="form-control" data-validation="length" data-validation-length="max45" data-validation-help="Ex: 0000:0000:0000:0000:0000:0000" name="device[][device_ip6]" type="text">
        </div>
        <div class="form-group">
          <label for="device_username">Device Username</label>
          <input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[][device_username]" type="text">
        </div>
        <div class="form-group">
          <label for="device_password">Device Password</label>
          <input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[][device_password]" type="text">
        </div>
      </div>
    </div>
  </div>
</div>
</form>

Answer 1

将您的字段命名为devices[0][description]，devices[1][description]等字段。

如果每个对象具有完全相同数量的字段并且每个对象都是新记录 - 您可以使用devices[][description]并且浏览器将为您填充索引，但如果您决定，这可能导致将来出现错误使用相同的表格来编辑记录。

另见How to get form input array into PHP array

如何使用同名的多个字段对HTML进行分组

1 个答案: