从 FormData api 检索 3.0 之前不支持 request.part 的 servlet 的请求参数答案

【问题标题】：Retrieving request parameters from FormData api for servlets prior to 3.0 where request.part is not supported从 FormData api 检索 3.0 之前不支持 request.part 的 servlet 的请求参数
【发布时间】：2014-07-29 18:36:11
【问题描述】：

基本上，我正在尝试将表单参数作为发布数据发送到另一个 jsp 并打印参数，但我在完成此操作时遇到了问题。下面是构造 FormData 实例并将其作为 XMLHttpRequest 的 post 数据发送到目标 jsp 的 html 代码。

    <!DOCTYPE html>
    <html>
    <head>
    <script>
    function loadXMLDoc()
    {
    var form = new FormData();
    form.append('firstname', 'peter');
    form.append('lastname', 'parker');
    var xmlhttp;
    if (window.XMLHttpRequest)
      {
      xmlhttp=new XMLHttpRequest();
      }
    else
      {
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.onreadystatechange=function()
      {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
        document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
        }
      }
    xmlhttp.open("POST","sample.jsp",true);
    xmlhttp.send(form);
    }
    </script>
    </head>
    <body>

    <div id="myDiv"><h2>Text which will be changed on click</h2></div>
    <button type="button" onclick="loadXMLDoc()">Change Content</button>

    </body>
    </html>

目标 jsp servlet 代码如下所示，我尝试检索附加到 FormData 实例的参数。

<%
    out.println(request.getParameter("firstname"));
    out.println(request.getParameter("lastname"));
%>

但是当我尝试运行 jsp 时，我得到的参数打印为空。我是 ajax 和客户端脚本世界的新手。那么有人可以解释一下我如何成功地从 FormData 实例中检索参数吗？

【问题讨论】：

你不是在使用 jquery ajax 吗？
@Santino'Sonny'Corleone：我不知道 jquery，因为我刚开始使用客户端。这就是为什么
好的，我会帮助你的

标签： javascript ajax jsp xmlhttprequest form-data

【解决方案1】：

$( document ).ready(function() {
$( "#button_click" ).click(function(){
var form= new FormData();
    form.append('firstname', 'peter');
    form.append('lastname', 'parker');
$.ajax({
    url: 'sample.jsp',
    data: form,
    cache: false,
    contentType: "application/x-www-form-urlencoded",
    processData: false,
    type: 'POST',
    success: function(data){
        alert(data);
    }
});
});
});

<div id="myDiv"><h2>Text which will be changed on click</h2></div>
 <button id="button_click" type="button">Change Content</button>

您还需要上面的这些标题

<script src="//code.jquery.com/jquery-1.10.2.js"></script>

现在请求并让我知道它是否有效

更新

试试这个 jsfiddle http://jsfiddle.net/Ujryx/25/

HTML

<form id="formoid" action="sample.jsp" title="" method="post">
    <div><label class="title">First Name</label><input type="text" id="firstname" name="firstname" ></div>
<div><label class="title">Name</label><input type="text" id="lastname" name="lastname" ></div>
<div><input type="submit" id="submitButton"  name="submitButton" value="Submit"></div>

$("#formoid").submit(function(event) {

  event.preventDefault();

    var $form = $( this ),
      url = $form.attr( 'action' );

  var posting = $.post( url, { firstname: $('#firstname').val(), lastname: $('#lastname').val() } );


  posting.done(function( data ) {
    alert('success');
  });
});

【讨论】：

谢谢，但不幸的是它不起作用.. 按钮点击没有任何反应
你放脚本了吗？好的，试试这个。在 chrome 中打开按 ctrl+shift+i，这是开发者控制台...n c 如果你遇到错误..
是的，我添加了脚本
ok 试试这个。在 chrome 中打开按 ctrl+shift+i，这是 d 开发者控制台...n c 如果你遇到错误。
@aarish 现在试试..有一个额外的括号