php - 使用 AJAX 在 Laravel 中将项目添加到数据库，然后显示项目

Question

经过几个小时的谷歌搜索，我似乎无法找到这个看似简单的问题的答案。我无法将数据添加到数据库并在不刷新页面的情况下显示该数据。我的目标是能够从表单创建一个对象以上传到数据库，然后显示数据库中的所有项目(无需刷新页面)。我曾多次尝试让 AJAX 工作，但我似乎做不到。该应用程序通过为学生添加星星来工作，所以基本上我希望能够在不重新加载页面的情况下更新学生的星星数。但是现在我什至无法 console.log 提交的表单数据。我的 Controller 代码是这样的:

    public function addStar(){

    $id = Input::get('id');
    $user_id = Input::get('user_id');

    if(Auth::user()->id == $user_id){

        Student::addStar($id);

    }

    return Redirect::back();

}

还有我的表格:

             {{Form::open(array('action'=>'HomeController@addStar','id'=>'addStar','method'=>'post'))}}
        {{ Form::hidden('id', $student->id, array('id'=>'id_value')) }}
        {{ Form::hidden('user_id', $student->user_id, array('id'=>'user_id_value'))}}
        {{ Form::submit('+')}}
        {{ Form::close() }}

我对 AJAX 的尝试非常糟糕:

$('#addStar').on('submit',function(e) {
    e.preventDefault();
    $.ajax({
        type: 'POST',
        cache: false,
        dataType: 'JSON',
        url: '/addstar',
        data: $('#addStar').serialize(),
        success: function(data) {

            console.log(data);
        },

    });
    return false;
});

如果我满足于允许页面重新加载，代码工作正常，但我不希望那样。所以基本上，我的问题是，如何将数据添加到数据库并在不重新加载页面的情况下显示它？非常感谢!

Answer 1

您的 Controller 在逻辑之后进行重定向，ajax 将无法对响应执行任何操作。一种做法是，在添加开始后返回新的星级。

public function addStar(){

    $id      = Input::get('id');
    $user_id = Input::get('user_id');

    if(Auth::user()->id == $user_id){

        Student::addStar($id);

    }

    $star_count = //get new star count;

    return Response::json(['star_count' => $star_count]);
}

由于 Controller 现在返回一个 json 响应，$.ajax 上的 success 回调可以捕获它并做一些事情(更新星数)。