javascript - JQuery提交表单参数为空

Question

我正在使用 $('#myForm').submit 提交表单，我的其余服务接受 application/x-www-form-urlencoded 的内容类型，但是使用submit()时，我在浏览器开发人员工具的XHR选项卡中看不到请求，并且表单参数未到达Rest服务，我可以使用AJAX post并指定内容类型，但Rest服务会在其他服务中生成八位字节流如果回复包含可下载的 csv/pdf 文件，正确提交表单的解决方案是什么？

Answer 1

为什么你不使用类型为“post”的 $.ajax() ？您可以在那里轻松设置标题

// Request with custom header
$.ajax({
    url: 'foo/bar',
    type: 'post',
    headers: { 'content-type': 'application/x-www-form-urlencoded' },
    data: {}, // object of your data
    success: function(response){
       alert(response)
    }
});

如果您的 api 响应位于八位字节流或可下载文件中，那么您必须创建虚拟表单并通过 jQuery 发布它，因为通过 AJAX 无法下载文件。当文件下载时，当前页面的内容将保持不变事件表格已发布。

function autoGenerateAndSubmitForm(method, url, post_data) {
    var element = document.getElementById("virtual_form");
    if(element != null )
    {
        element.parentNode.removeChild(element);
    }
    var form = document.createElement("form");
    form.setAttribute("id", "virtual_form");
    form.setAttribute("style", "display:none;");
    //form.setAttribute("target", "_blank"); // remove comment if you want to open it in new tab
    form.method = method;
    form.action = url;   
    for(i in post_data)
    {
         var element=document.createElement("input");
         element.value=post_data[i];
         element.name=i;
         form.appendChild(element); 
    }
    document.body.appendChild(form);
    form.submit();
    form.parentNode.removeChild(form);
}

使用您的 poper 参数调用下面的函数

autoGenerateAndSubmitForm('POST','your_url',{your_post_data_object:"Here"});