Question

此刻我正在使用laravel。在这种情况下，我有一个表单，通过使用ajax成功提交给控制器。并且该控制器将其发送到数据库。但问题是，即使数据库更新，ajax正在完成其工作，整个页面在提交后仍保持不动/不变。

现在我想要什么

我想向用户反馈您的帖子在那里成功提交。或者我想要进一步做什么，我想刷新从数据库中收集帖子的部分，因为可以从那里检索这篇文章。但是只能使用ajax。

因此无需收集整个页面或刷新。

这是我的表单结构

`

    {{ Form::open(array('route' => array('questions.store'), 'class' => 'form-horizontal'  )) }}

    blah blah blaaa .......


    <script type="text/javascript">

                        $(".form-horizontal").submit(function(e){
                        $(this).unbind("submit")
                        $("#ask").attr("disabled", "disabled")


                        var that = $(this),
                            url = that.attr('action'),
                            type = that.attr('method'),
                            data = {};
                        that.find('[name]').each(function(index, value){
                                var that = $(this),
                                name = that.attr('name'),
                                value = that.val();

                                data[name] = value;

                        });

                        $.ajax({
                            url: url,
                            type: type,
                            data: data,
                            success: function(response){
                                console.log(response);
                            }
                        });

                        return false;
                    });
                    </script>


{{ Form::close() }}

` 由于非常明显地通过路线更新了帖子＆amp;控制器我希望在发布成功后显示此脚本的另一个潜水和成功消息。我正在寻找一些专业的结构，使用与服务器端进行交互的最小需求，并为用户提供更好的页面查看体验。

非常感谢帮助我完成这项研究。

Answer 1

我不确定我是否理解你，但是如果你想通知用户ajax-db db update的结果你需要

ajax save db调用的路由 - 它应该指向执行db update的方法。
db update方法应该返回一些表示更新成功/失败的值（例如OK或FAIL）
调用该方法的唯一结果将是纯文本页面，其中OK或FAIL为正文
通过ajax获取结果并相应地通知用户（在表单提交按钮之后）

查看以下代码，了解ajax调用本身（在表单提交处理程序中），看看我的意思

    var db_ajax_handler = "URL_TO_YOUR_SITE_AND_ROUTE";

    var $id = 1; //some id of post to update
    var $content = "blablabla"  //the cotent to update

        $.ajax({
                cache: false,
                timeout: 10000,
                type: 'POST',
                tryCount : 0,
                retryLimit : 3,
                url: db_ajax_handler,
                data: { content: $content, id: $id }, /* best to give a CSRF security token here as well */ 
                beforeSend:function(){

                },
                success:function(data, textStatus, xhr){

                     if(data == "OK") 
                     {
                        $('div.result').html('The new Question has been created');
                     }
                     else
                     {
                       $('div.result').html('Sorry, the new Question has not been created');  
                     }


                },
                error : function(xhr, textStatus, errorThrown ) {
                    if (textStatus == 'timeout') {
                        this.tryCount++;
                        if (this.tryCount <= this.retryLimit) {
                            //try again
                            $.ajax(this);
                            return;
                        }
                        return;
                    }
                    if (xhr.status == 500) {
                        alert("Error 500: "+xhr.status+": "+xhr.statusText);

                    } else {
                        alert("Error: "+xhr.status+": "+xhr.statusText);

                    }
                },
                complete : function(xhr, textStatus) {

                }
            });

编辑：根据评论，在步骤2（使用AJAX调用的方法）替换

if($s) 
{ 
    return Redirect::route('questions.index') ->with('flash', 'The new Question has been created'); 
}

带

return ($s) ? Response::make("OK") : Response::make("FAIL");

编辑2： 要将验证错误传递给ajax-returned-results，您不能使用

return Response::make("FAIL")
        ->withInput()
    ->withErrors($s->errors());

this post

提交后使用ajax和页面视图审核表单提交

1 个答案: