带有 Spring MVC 的 Ajax 无法正常工作答案

【问题标题】：Ajax with Spring MVC not working带有 Spring MVC 的 Ajax 无法正常工作
【发布时间】：2012-09-03 00:49:28
【问题描述】：

这是我尝试插入用户的jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <title>Add Users using ajax</title>
        <script src="/Spring3MVC/js/jquery.js"></script>
        <script type="text/javascript">
        function doAjaxPost() {
            // get the form values
            var firstName = $('#firstName').val();
            var lastName = $('#lastName').val();

            $.ajax({
                type: "POST",
                url: "/insert",
                data: "firstName=" + firstName + "&lastName=" + lastName,
                success: function(response) {
                    // we have the response
                    $('#info').html(response);
                    $('#firstName').val('');
                    $('#lastName').val('');
                },
                error: function(e) {
                    alert('Error: ' + e);
                }
            });
        }
        </script>
    </head>
    <body>
        <h1>Add Person</h1>
        <table>
            <tr><td>First Name : </td><td> <input type="text" id="firstName" name="firstName" /><br/></td></tr>
            <tr><td>Last Name : </td><td> <input type="text" id="lastName" name="lastName" /> <br/></td></tr>
            <tr><td colspan="2"><input type="button" value="Add Users" onclick="doAjaxPost()"><br/></td></tr>
            <tr><td colspan="2"><div id="info" style="color: green;"></div></td></tr>
        </table>
        <a href="/SpringMVC/search">Show All Users</a>
    </body>
</html>

这是我的控制器代码

@RequestMapping(value="/insert", method = RequestMethod.POST)
public String insertPerson(ModelMap model, HttpServletRequest request, HttpServletResponse response, @RequestParam("firstName") String firstName, @RequestParam("lastName") String lastName ) {
    personDao.savePerson(firstName,lastName);
    model.addAttribute("nameAdded", firstName+" "+lastName);
    return "personAdded";
}

当我单击“添加用户”按钮时，没有任何反应。谁能帮我解决这个问题？

【问题讨论】：

你希望它发生什么？
点击后，我希望它转到控制器代码..
你从不打电话给doAjaxPost()，是吗？
@sp00m - 我正在调用它。
尝试使用 firefox firebug 调试并找出点击时发生的情况。使用绝对 url 和 contextPath 总是更好。

标签： java jquery ajax jsp spring-mvc

【解决方案1】：

在 JSP 中使用 url 进行 AJAX 请求：

url: "insert"

代替：

url: "/insert"

您使用的是指向服务器根目录而不是控制器的绝对 URL。

我已经测试过了，你的代码对我来说效果很好。

【讨论】：

【解决方案2】：

这两个页面的绝对 URL 是什么，如果您在键盘上按 f12 键，您可以跟踪 ajax 调用并跟踪响应代码，如果是 200 则您的服务器端代码没有问题现在检查成功函数，否则检查服务器代码，当然 404 表示它没有到达服务器。

【讨论】：

【解决方案3】：

试试

data: {firstName: firstName, lastName: lastName},

而不是

data: "firstName=" + firstName + "&lastName=" + lastName,

在您的 ajax 调用中。

【讨论】：

【解决方案4】：

除了 Ajax 帖子之外，您在任何地方都使用上下文 URL。

应该

url: "/insert",

也许

url: "/SpringMVC/insert",

甚至更好

url: "<spring:url value='/insert' />",

【讨论】：

那我建议你找一些好的javascript调试工具（比如带有FireBug插件的FireFox）开始调试你的代码和网络流量。