Question

我有一个HTML表单，如下所示：

<form class="form-horizontal" id="create_user" method="POST" action="#" accept-charset="UTF-8">
    <span>Username</span><input required="true" type="text" name="username" id="username">

    <span>E-mail</span><input type="email" name="email" id="email">

    <span>Privileges</span><select id="role" name="role"><option value="1">Administrator</option><option value="2">Employee</option><option value="3">Dealer</option></select>

    <span>Password</span><input type="password" name="password" id="password">

    <span>Repeat Password</span><input type="password" name="repeat_password" id="repat_password">

    <input class="btn-primary btn" type="submit" value="Submit">

    <input class="btn-inverse btn" type="reset" value="Reset">
</form>

我正在尝试使用AJAX将数据发送到服务器，例如：

$("form").submit(function(){

            var form_data = $(this).serialize();

            var request = $.ajax({
                url: "user/validate",
                type: "POST",
                data: form_data 
            });
            request.done(function (response, textStatus, jqXHR){
                alert(response);//Comes back blank
            })
            // callback handler that will be called on failure
            request.fail(function (jqXHR, textStatus, errorThrown){
                // log the error to the console
                console.error(
                    "The following error occured: "+
                    textStatus, errorThrown
                );
            });
        });

编辑：这是我的Laravel控制器，用于处理POST数据：

class User_Controller extends Base_Controller {

    public function post_validate() {
        return Input::get('username');
    }

}

但是，使用$(this).serialize()不会发送任何数据。如果我通过执行以下操作单独传递每个元素：$("#username").val()，它可以正常工作。我确保所有表单输入都有名称，但它仍然无效。

Answer 1

我认为您的网页会刷新：

$("form").submit(function(e){
     e.preventDefault(); //<-----try adding this

Answer 2

我测试了它，我不相信你的问题在于序列化数据。

这是一个jsFiddle：http://jsfiddle.net/6nd5K/

你应该通过检查序列化在进入你的AJAX方法之前是否做了任何事情来进行测试。

$('form').submit(function() { alert($(this).serialize()); return false; });

我认为你的问题在于数据的任何过程。

Answer 3

$(".btn-primary").on(click, function(){

        var request = $.ajax({
            url: "/user/validate",
            type: "POST",
            data: $('form#create_user').serialize(),
            async: false

        });
        request.done(function (response, textStatus, jqXHR){
            alert(response);//Comes back blank
        })
        // callback handler that will be called on failure
        request.fail(function (jqXHR, textStatus, errorThrown){
            // log the error to the console
            console.error(
                "The following error occured: "+
                textStatus, errorThrown
            );
        });
    });

jQuery serialize（）不起作用

3 个答案: