Laravel Response :: json无效

Question

我有一个表格如下

{{ Form::model($user, array('method' => 'POST','id'=>'personalInformation', 'class'=>'form-horizontal','route' => array('user.updatepersonalinformation', $user->id))) }}
                        <div class="form-group">
                            <label class="control-label">First Name</label>
                            <input type="text" placeholder="John" class="form-control"/>
                        </div>


                        <div class="margiv-top-10">
                            <button  id="#btnSavePersonalInformation"  class="btn green">Save Personal Information </button>
                            <a href="#" class="btn default">Cancel </a>
                        </div>
{{Form::close()}}

和这样的路线

Route::post('savePersonalInformation/{id}',['uses'=>'UsersController@savePersonalInformation', 'as'=>'user.updatepersonalinformation']);

路线方法简单明了

    public function savePersonalInformation($id) {

    return Response::json(array('user' => $id));
}

我希望使用ajax提交此表单。为此，我有以下代码

$('#btnSavePersonalInformation').click(function() {
    var personalForm = $('#personalInformation');

    personalForm.submit(function(e){
        e.preventDefault();
        $.ajax({
            type:'POST',
            url: personalForm.attr('action'),
            data: personalForm.serialize(),
            dataType: "json"
        })
        .done(function (response) {
            var jsonResponse = JSON().parse(response);
            alert  (jsonResponse[0]['Userid']);

        })
        .fail(function (response) {
            // Sending request to the server has failed
            // We'll show a notification that something went wrong
            console.log(response);

        })

    });
});

表单被称为路由中的确切消息被转储到屏幕上，但没有触发警告框。我的意思是结果被转储到浏览器而不是我通过警告框显示给用户。

请指出我在这里做错了什么？

更新 如下所述，我完全删除了JSON解析命令，但我仍然得到相同的结果。 这是更新的代码

   $('#btnSavePersonalInformation').click(function() {
    var personalForm = $('#personalInformation');

    personalForm.submit(function(e){
        e.preventDefault();
        $.ajax({
            type:'POST',
            url: personalForm.attr('action'),
            data: personalForm.serialize(),
            dataType: "json"
        })
            .done(function (response) {

                alert  (response);

            })
            .fail(function (response) {
                // Sending request to the server has failed
                // We'll show a notification that something went wrong
                console.log(response);

            })

    });
});

谢谢

Answer 1

$(document).ready(function(){
        $('#btnSavePersonalInformation').click(function(e) {
            var personalForm = $('#personalInformation');

            personalForm.submit(function(e){
                e.preventDefault();
                $.ajax({
                    type:'POST',
                    url: personalForm.attr('action'),
                    data: personalForm.serialize(),
                    dataType: "json"
                })
                .done(function (response) {                 
                    console.log(response.user);
                })
                .fail(function (response) {
                // Sending request to the server has failed
                // We'll show a notification that something went wrong
                console.log(response);

            })

            });
        });
    });

<button  id="btnSavePersonalInformation"  class="btn green">Save Personal Information </button>

Answer 2

我认为JSON.Parse()调用存在语法问题。

应该是

var jsonResponse = JSON.parse(response);

Answer 3

你可以试试这个：

$('#btnSavePersonalInformation').on('click', function(e){
    e.preventDefault();
    $.ajax({
        type:'POST',
        url: personalForm.attr('action'),
        data: personalForm.serialize(),
        dataType: "json"
    })
    .done(function(response) {
        alert(response.user);
    })
    .fail(function(response) {
        console.log(response);
    });
});

而不是像这样：

$('#btnSavePersonalInformation').click(function() {

    var personalForm = $('#personalInformation');

    personalForm.submit(function(e){

        e.preventDefault();

        // ...

    });
});

取决于此服务器端方法：

public function savePersonalInformation($id) {
    return Response::json(array('user' => $id));
}