0

我正在做一个玩具程序，要求用户在 html 表单上输入“用户名”和“全名”，该表单将由 AJAX 提交给 Spark 框架中的以下方法（请参阅此处的 Spark：

post("/admin/user/signup", "application/json", (request, response) -> {
            String username = request.queryParams("username");
            String fullname = request.queryParams("fullname");
            System.out.println("username is: " + username +", full name is: " + fullname);
            Map<String, Object> registerResults = new HashMap<String, Object>();
            registerResults.put("success", "successfully registered " + username);
            return new MyMessage("successful registration!");
        }, new JsonTransformer());

以下是我的 AJAX 代码，它应该提交并接收来自上述 post() 方法的响应：

<script>
        $(document).ready(function() {
            $('#registerForm').submit(function() {
                var formData = $('#registerForm').serialize();    /* capture the form data*/
                $.getJSON('/admin/user/signup', formData, registerResults);
           //     $.post('/admin/user/signup', formData, registerResults);   /* get JSON back from the post method */
            });
            function registerResults(data) {
                    $('#registerForm').fadeOut();
                    $('.starter-template').html(data.message);
                }  // end of registerResults
        });  // end of ready
        </script>

但是，AJAX 代码无法接收 JSON 对象，而是将 JSON 对象简单地打印在网页 /admin/user/signup 上：

{"message":"successful registration!"}

所以我请求帮助如何将 JSON 对象返回到 Spark 中的 AJAX 请求？谢谢

4

3 回答 3

2

您确实意识到您正在提交表单。因此，不是假设的 AJAX 调用，而是提交表单，因此生成的页面......

所以你应该通过简单地添加来停止表单提交传播

event.preventDefault();

或return false；在提交处理程序的末尾。

在表单提交处理程序中。

<script>
        $(document).ready(function() {
            $('#registerForm').submit(function(event) {
            event.preventDefault();
                var formData = $('#registerForm').serialize();    /* capture the form data*/
                $.getJSON('/admin/user/signup', formData, registerResults);
           //     $.post('/admin/user/signup', formData, registerResults);   /* get JSON back from the post method */
            });
            function registerResults(data) {
                    $('#registerForm').fadeOut();
                    $('.starter-template').html(data.message);
                }  // end of registerResults
        });  // end of ready
        </script>
于 2014-06-04T06:48:17.560 回答
0

代替return new MyMessage("successful registration!");

就这样通过return new MyMessage(registerResults);

现在，您没有返回此registerResults地图值。
我希望你正在使用游戏框架。那么它应该可以工作

还有一件事，你应该拒绝提交表单。所以，使用

 $('#registerForm').submit(function(e) {
            e.preventDefault();
// do your stuff here

});
于 2014-06-04T07:44:25.993 回答
-1

您不能使用 html() 函数将 json 视为 HTML，您需要通过 jQuery 的 parseJson() 函数对其进行解析：http: //api.jquery.com/jquery.parsejson/

var obj = jQuery.parseJSON(data);
$('.starter-template').html(obj.message);
于 2014-06-04T06:52:37.647 回答