Question

我正在研究一个项目，该项目需要在提交之前更改FormData。我无法更改元素值，我必须更改进入POST的实际FormData。

我尝试更改form.onsubmit以更新值（某些字段有效，但由于验证检查而无法使用其他字段）

<form name="aspnetForm" method="post" action="Posturl.aspx" onsubmit="javascript:return WebForm_OnSubmit();" id="aspnetForm" autocomplete="off">
   <input type="text" name="field1" id="field1" value="">
   <input type="text" name="field2" id="field2" value="">
</form>

我知道我可以创建一个新的FormData对象，并可以使用formData.set（'field1'，'newValue'）设置该对象的值，但是不确定如何发布此新FormData对象而不是旧对象。

Answer 1

您只需将数据与onsubmit一起放入输入

<form name="aspnetForm" method="post" action="Posturl.aspx" onsubmit="formData.set('field1', 'newValue');javascript:return WebForm_OnSubmit();" id="aspnetForm" autocomplete="off">
   <input type="text" name="field1" id="field1" value="">
   <input type="text" name="field2" id="field2" value="">
</form>

Answer 2

您可以通过将事件侦听器置于“ [type ='submit']”按钮上来获取数据。在以下示例中，我使用jquery定位表单，并使用ajax发送请求。希望对您有所帮助。

$("#submit-info").click(function ()
    {
    var data = new FormData($('form')[0]);
    data.append("route",1); (//adding a new value)
    data.set('field','newValue'); //use the name attribute of html tag to target the respective key-value pair

    $.ajax({
        send the data(optional)
    });
});

 <form method="post" enctype="multipart/form-data" >
  <input type="text" name="field" id="field1" value="">
 <button type="submit" class="btn btn-primary" id="submit-doc">Submit</button>
 </form>

Answer 3

var formData =new FormData();
   formData.set('field1', 'sample');
   formData.set('field2', 'try');
   formData.set('field3', 'again');
    
      //delete the key
   formData.delete('field1');

   //append new value of the key
   formData.set('field1', 'test');

   
   //check all formdata values
   for(var pair of formData.entries()) 
   {
       console.log('FormData Pair ('+ pair[0]+ ': '+ pair[1]+')'); 
   }

您可以通过删除键并设置新值来尝试此解决方案

   var formData =new FormData();
   formData.set('field1', 'sample');
    
   //delete the key
   formData.delete('field1');

   //append new value of the key
   formData.set('field1', 'test');


   //check the formdata key if value was updated object
   for(let val of formData.values())
   {
       console.log(val);
   }

Answer 4

FormData 接口的 set() 方法为 FormData 对象内的现有键设置新值，如果键/值不存在，则添加该键/值。

var formData = new FormData(); // Currently empty
// Add a value
formData.append('username', 'Chris');

// Change value
formData.set('username', 'tom');

know more

如何在提交之前更改FormData？

4 个答案: