在 laravel 5.4 中刷新聊天部分

【问题标题】：refresh chat section in laravel 5.4在 laravel 5.4 中刷新聊天部分
【发布时间】：2017-06-19 11:16:04
【问题描述】：

我正在使用聊天系统，我需要刷新聊天部分以显示使用 ajax 发送的新消息，这是我的消息刀片

 <div class="container">
        <div class="row">
            <div class="col-md-8 col-md-offset-2">
                <div class="panel panel-default">
                    <div class="panel-heading">messenger</div>

                    <div class="panel-body">
                        @if($array)
                            @foreach ($array as $message)
                                @foreach ($message->messages_reply as $reply)
                                    <li>  {{ $reply['msg']}} </li>
                                @endforeach
                            @endforeach
                        @endif
                        <br >
                        <form method="post" action="{{url("sendMessage")}}">
                            {{ csrf_field() }}
                            <input type="hidden" name="user_from" value="{{$from}}">
                            <input type="hidden" name="user_to" value="{{$to}}">
                            <input type="hidden" name="date" value="{{time()}}">
                            <input type="text" class="form-control" name="msg">
                            <br >
                            <input type="submit" value="send" class="btn btn-primary">
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

【问题讨论】：

向
添加一个类。并在成功插入消息后，通过 ajax (append) 在最后一个 li 标签下方添加该消息

然后在ajax成功状态下通过“window.location.reload”重新加载页面

你写的，你想显示由 ajax 发送的新消息。所以你使用ajax。向我们展示您如何在表格中添加新消息。

类消息扩展模型 { protected $fillable=['user_from','user_to','date'];公共函数messages_reply() { return $this->hasMany(messages_replay::class , 'messages_id'); } 公共函数 user_from() { return $this->belongsTo(User::class , 'user_from'); } 公共函数 user_to() { return $this->belongsTo(User::class , 'user_to'); } }

这是我的模特

标签： php ajax laravel-5 laravel-5.4

【解决方案1】：

使用 ajax 提交新消息。

为提交按钮添加 1 个 ID

<input type="submit" id="sendMessage" value="send" class="btn btn-primary" />

并在你的刀片文件中添加这个 ajax

$("body").on("click","#sendMessage",function(e){
                e.preventDefault();
                var user_from= $("#user_from").val();
                var user_to= $("#user_to").val();
                var date= $("#date").val();
                var msg= $("#msg").val();
                $.ajax({
                    type:"POST",
                    url:"{{url('sendMessage')}}",
                    data: {"user_from": user_from,"user_to": user_to,"date":date,"msg":msg},
                    success:function(res){
                       // Reload the page as you wanated
                        window.location.reload();
                    }
                });
            });

【讨论】：

将此添加到您的刀片文件中
res 是您从 ajax 调用中获得的结果。或者你可以说ajax的返回值。
如果您完全不了解 ajax，最好阅读文档 api.jquery.com/jquery.ajax
很高兴能帮上忙！