没有调用Ajax post方法

时间:2013-02-24 10:30:24

标签: jquery servlets

Ajax没有调用servlet

我的web.xml:

<web-app xmlns="http://java.sun.com/xml/ns/javaee" version="2.5">
    <servlet>
        <servlet-name>LoginServlet</servlet-name>
        <servlet-class>com.web.LoginServlet</servlet-class>
    </servlet> 
    <servlet-mapping>
        <servlet-name>LoginServlet</servlet-name>
        <url-pattern>/LoginServlet</url-pattern>
    </servlet-mapping>
</web-app>

剧本:

//function to check name and comment field 
function checkCommentsForm(){
    if(userName.attr("value") && userPass.attr("value"))
    {
        alert("true returned");
        return true;
    }
    else
    {
        alert("fasle returned");
        return false;  
    }
}
//When form submitted
$("#formL").submit(function(){
    if(checkCommentsForm()){
        $.ajax({
            type:"POST",
            url:"/LoginServlet/",
            data:"user="+userName.val()+"&pass="+userPass.val(),
            success: function(msg) {$('#targetDiv').hide();$("#targetDiv").html ("<h3>" + msg + "</h3>").fadeIn("slow");
            }
        });
        alert('ppppppppppppppppp----------');
    }
    else 
        alert("Please fill UserName & Password!");
    return false;
    });
});

表格:

<div>
    <form id="formL" name="formL" method="post" onsubmit="return false;">
        <span class="style3"><strong>Enter Username &amp;
            Password to Login : </strong></span><br> <br> <span class="style1">Username :&nbsp;</span>&nbsp;
            <input name="user" id="user" type="text"> <br>
            <span class="style1">Password :</span>&nbsp;&nbsp; <input name="pass" id="pass" type="password"> <br>
            <input name="button" id="button" value="Submit" type="submit">
    </form>
</div>
<div id="targetDiv" style="display: none;"></div>

警报如下:

**The servlet are working but through ajax it was not called any clue what happen ?**

1 个答案:

答案 0 :(得分:2)

在webbrowser的开发人员工具集的“网络”部分中阅读HTTP流量监视器(在Chrome / IE9 / Firefox中按F12)。您应该已经注意到ajax请求已返回HTTP 404响应,该响应基本上是“找不到页面”错误。

您已经指定了一个与域相关的servlet URL,前缀为/。想象一下,JSP已在http://localhost:8080/context/login.jsp上打开,然后/LoginServlet的servlet URL会将HTTP请求发送到http://localhost:8080/LoginServlet,而您确实需要将其发送到http://localhost:8080/context/LoginServlet

相应修复:

url: "LoginServlet"

对具体问题

无关,整个设计很奇怪,并没有真正逐步增强。即当最终用户禁用JS时,整个表单根本不起作用。您应该始终使用完全正常工作的表单,而不需要任何单行JavaScript。

假设一个基本启动示例为

<form id="login" action="login" method="post">
    <input type="text" name="user" />
    <input type="password" name="pass" />
    <input type="submit" value="Login" />
    <span id="message">${message}</span>
</form>

然后你可以用一种可重复使用的方式增强如下:

$("#login").submit(function() {
    var $form = $(this);
    $.post($form.attr("action"), $form.serialize(), function(data) {
        // ...
    });
    return false;
});

请注意$.serialize()以适当的方式透明地序列化所有表单数据。你完全没有对用户/通过请求参数进行URL编码,当最终用户在用户名和/或密码中使用URL不安全的特殊字符时,这些参数会破坏表单提交。

另见: