jQuery如何仅在表单具有某些数据数组时提交更改的字段 [英] JQuery how to submit only changed fields when the form has some data array

问题描述

我有一个具有一对多关系的数据库结构.在html表单中，有类似的输入，其名称为'item []'或'file []'，以使数据成为数组

I have a database structure with an one to many relationship. In the html form, there are similar inputs with a name 'item[]' or 'file[]' to make the data to be an array

<form action="submit.php" method="get">
  Name:<input type="text" name="name"/><br/>
  Item:<input type="text" name="item[]"/><br/>
  File:<input type="file" name="file[]" multiple/>
  Item:<input type="text" name="item[]"/><br/>
  File:<input type="file" name="file[]" multiple/>
  Select:<select name="select" value="1" original="1">
  <option value="1">One</option>
  <option value="2">Two</option>
  </select>

</form>

我怎样才能只提交更改的字段，并且在服务器端我可以确认更改了哪个项目?我尝试禁用输入，但似乎不起作用.

how can i submit only the changed field, and in the server side i can recongize which item is changed? I tried disable the inputs, but it seems not working.

另一个问题是，如果我使用ajax提交表单，该如何提交文件

another problem is that if i submit the form with ajax, how can i submit the files

推荐答案

您可以使用jQuery解决此问题，并在每个更改的input
上添加一个类. 比起您可以禁用所有不带类的inputs并提交表单

You could solve this with jQuery and add a class on every changed input
Than you can disable all inputs without the class and submit the form

$(document).ready(function() {
  $('input, select, textarea').on('change', function() {
    $(this).addClass('changed');
  });
  
  $('form').on('submit', function() {
    $('input:not(.changed), textarea:not(.changed)').prop('disabled', true);
    
    // alert and return just for showing
    alert($(this).serialize().replace('%5B', '[').replace('%5D', ']'));
    return false;
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form action="submit.php" method="get">
  Name:<input type="text" name="name" /><br/><br/>
  Item:<input type="text" name="item[]" /><br/><br/>
  File:<input type="file" name="file[]" multiple /><br/><br/>
  Item:<input type="text" name="item[]" /><br/><br/>
  File:<input type="file" name="file[]" multiple /><br/><br/>
  Select:<select name="select" value="1" original="1">
  <option value="" selected="selected" disabled="disabled"></option>
  <option value="1">One</option>
  <option value="2">Two</option>
  </select><br/><br/>
  <button type="submit">send</button>
</form>

您可以在name属性中使用索引，例如<input type="text" name="item[1]" />

You could use indexes in the name attribute like this <input type="text" name="item[1]" />

这篇关于jQuery如何仅在表单具有某些数据数组时提交更改的字段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！