Ajax调用不起作用

时间:2012-07-02 11:00:09

标签: java javascript ajax jsp servlets

我是ajax概念的新手,我想在不刷新页面的情况下提交表单

AJAX

function ajaxFunction() {
  if(xmlhttp) { 
   var txtname = document.getElementById("txtname");
    xmlhttp.open("POST","Listservlet",true);
    xmlhttp.onreadystatechange  = handleServerResponse;
    xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xmlhttp.send("txtname=" + txtname.value);
  }
}

function handleServerResponse() {
   if (xmlhttp.readyState == 4) {
     if(xmlhttp.status == 200) {
       document.fname.message.innerHTML=xmlhttp.responseText;
     }
     else {
        alert("Error during AJAX call. Please try again");
     }
   }
}

JSP

<form name="fname" action="Listservlet" method="post">
<input type="text" name="txtname" id="txtname" />
<input type="button" value="Submit"  onclick="ajaxFunction();" />
<div id="message"></div>
</form>

的servlet

public void doPost(HttpServletRequest request,HttpServletResponse response) throws IOException, ServletException {
  String name = null;
  PrintWriter out = response.getWriter();
  if(request.getParameter("txtname") != null) {
   name = request.getParameter("txtname");
  }
                else {
                       name = "";
                }
           out.println("You have successfully made Ajax Call:" + name);
 }

这是我从谷歌那里获得的ajax想法,但它没有用, 点击按钮时,没有任何显示。 请帮帮我。

2 个答案:

答案 0 :(得分:2)

替换

 document.fname.message.innerHTML=xmlhttp.responseText;

通过

document.getElementById("message").innerHTML=xmlhttp.responseText;

答案 1 :(得分:1)

一般步骤找出错误的地方

  • 使用浏览器调试器判断ajax请求是否已成功发送;
  • 调试接收Servlet,判断请求是否实际传递到您的Servlet;
  • 使用浏览器调试器判断响应文本是否合适;

    对于你的问题,我认为你需要 更改 document.fname.message.innerHTML=xmlhttp.responseText;
    document.getElementById("message").innerHTML = xmlhttp.responseText;

    另请记住关闭您的ouputstream