jQuery不处理结果

时间:2013-08-21 13:43:50

标签: java javascript jquery spring

在我的脚本中,我发送数据以检查数据库中是否存在用户名,但无论如何都会创建用户。我检查过控制器工作正常。我是否以正确的方式处理结果?

我的剧本

 $( "#dialog-form" ).dialog({
            autoOpen: false,
            height: 600,
            width: 350,
            modal: true,
            buttons: {
                "Create an account": function() {
                    var bValid = true;
                    allFields.removeClass( "ui-state-error" );                                               
                    var values = $("form").serialize();
                    $.ajax({
                        type: "POST",
                        url: "/checkLogin",
                        data: values,
                        success: function(result) {
                            bValid = result == 'true';}})
                    if ( bValid ) {
                        var values = $("form").serialize();
                        $.ajax({
                            type: "POST",
                            url: "${pageContext.request.contextPath}/addUser",
                            data: values
                        })
                        $( "#users tbody" ).append( "<tr>" +
                                "<td>" + login.val() + "</td>" +
                                "<td>" + fname.val() + "</td>" +
                                "<td>" + lname.val() + "</td>" +
                                "<td>" + bday.val() + "</td>" +
                                "<td>" + role.val() + "</td>" +
                                "<td>"+ "<a href=\"/edit/" + login.val() + "\">Edit   </a>"
                                + "<a href=\"/delete/" + login.val() + ".json\">Delete</a></td>" +
                                "</tr>" );
                        $( this ).dialog( "close" );
                    }
                },
                Cancel: function() {
                    $( this ).dialog( "close" );
                }
            },
            close: function() {
                allFields.val( "" ).removeClass( "ui-state-error" );
            }
        });
        $( "#create-user" )
                .button()
                .click(function() {
                    $( "#dialog-form" ).dialog( "open" );
                });
    });

这是我的控制器

@RequestMapping(value="/checkLogin", method=RequestMethod.POST)
@ResponseBody
public boolean check(@RequestParam("login") String login) {
    return (userService.findByLogin(login) == null);
}

这是我的HTML

<div id="dialog-form" title="Create new user">    
<form:form >
    <fieldset>
        <label for="login">Login</label>
        <input type="text" name="login" id="login" class="text ui-widget-content ui-corner-all" />
        <label for="password">Password</label>
        <input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" />            
    </fieldset>
</form:form>
</div>
<button id="create-user">Add user</button>

1 个答案:

答案 0 :(得分:0)

以下是“创建用户”按钮功能的相关部分:

var bValid = true;
//...
$.ajax({
    //...
    success: function (result) {
        bValid = result == 'true';
    }
})
if (bValid) {
    //create user
}

$.ajax是异步的。这意味着只要触发了ajax请求(并且在返回响应之前),就会继续执行if (bValid)检查。由于您在上面将其定义为true,因此执行该块并创建用户。

我看到两个选项:

  1. 将整个if (bValid)块移动到第一个ajax回调中。

  2. 删除“用户名存在”ajax检查,并在用户创建过程中对服务器进行验证(无论如何你应该这样做)。这样,您只需要一个ajax调用,用户无法绕过验证。