如何将 for 循环数据添加到 form.serializer() - jquery

Question

我正在尝试通过 ajax 将两个动态输入字段发送到后端，我有主窗体，主窗体工作正常，不知道如何将两个额外的动态输入发送到后端，这里是我的代码

var extra_inputs = 2
var removed_extra_inputs = []
var formData = new FormData();

for(var i=0; i<extra_inputs; i++){
  try{
      formData.append("guestinfo-"+i, document.getElementById("guestinfo-"+i).value);
      formData.append("reason-"+i, document.getElementById("reason-"+i).value);
      }
  catch(err){
      console.log(err);
      }
  }

  const form = document.getElementById('post-form-add-booking')    
        
  const url = window.location.href
  const room = parseInt(room_number)
  form.addEventListener("submit",submitHanler);
  function submitHanler(e){
      e.preventDefault();
      $.ajax({
           type:'POST',
           url:url,
           data:$("#post-form-add-booking").serialize() + "&extra_inputs="+extra_inputs + '&removed_extra_inputs='+removed_extra_inputs,
           dataType:'json',
           success:successFunction,
           error:errorFunction,
                            
       })        
     }

但不确定是否可以将 formData 与 form.serilaizer 合并，谢谢您的帮助..

Answer 1

这就是我相信你的意思

$('#post-form-add-booking').on("submit",function(e) {
  e.preventDefault();
  const formData = new FormData(this); // adding the DOM form
  $("[id^=guestinfo], [id^=reason]").each(function() {
    formData.append(this.id, this.value)
  })
  $.ajax({
       type:'POST',
       url:url,
       data:formData,
       dataType:'json',
       success:successFunction,
       error:errorFunction,
   })    
})

如何将 for 循环数据添加到 form.serializer() - jquery

how to add a for loop data to form.serializer() - jquery

javascript

ajax

jquery