在警报框中显示消息与ajax和json laravel

时间:2017-10-13 07:29:00

标签: javascript php json ajax laravel

我有以下ajax代码:

    public function postInquire(Request $request)
{
    $data = array(
        'tripName' => $request->tripName,
        'fullName' => $request->fullName,
        'email' => $request->email,
        'telephone' => $request->telephone,
        'bodyMessage' => $request->message
    );

    Mail::to('mail@domain.com')->send(new TourInquire($data));
    return response()
     ->json(['code'=>200,'success' => 'Your inquire is successfully sent.']);
}

我在控制器中的代码:

Route::post('/inquire', 'PostPublicController@postInquire')->name('postInquire');

我发布我的ajax表单的路线是:

<div class="modal-body">
                <div id="form-messages" class="alert success" role="alert" style="display: none;"></div>
                <div class="preview-wrap">

                    <img src="{{asset($tour->featuredImage->path)}}" class="preview-img thumbnail" alt="{{$tour->featuredImage->name}}">
                    <div class="form-wrap">
                        <form action="{{route('postInquire')}}" id="'#ajax-inquire" method="POST">
                            {{csrf_field()}}
                            <div class="form-group">
                                <input type="hidden" name="tripName" id="tripName" value="{{$tour->title}}">
                                <label>Name</label>
                                <input type="text" class="form-control" placeholder="Enter Your Full Name" name="fullName" id="fullName" required>
                            </div>
                            <div class="form-group">
                                <label>Email</label>
                                <input type="email" class="form-control" placeholder="Email Address" name="email" id="email" required>
                            </div>
                            <div class="form-group">
                                <label for="telephone">Phone</label>
                                <input type="tel" class="form-control" placeholder="Phone Number" name="telephone" id="telephone" required>
                            </div>
                            <div class="form-group">
                                <label for="message">Message</label>
                                <div class="row">
                                    <textarea name="message" id="message" cols="30" rows="5" class="form-control"></textarea>
                                </div>
                            </div>
                            <button class="btn btn-primary hvr-sweep-to-right">Send Message</button>
                        </form>
                    </div>
                </div>
            </div>

使用上述代码,我可以通过ajax请求发送邮件。我想在我的视图中在警告框中显示json响应消息。但是我无法这样做,因为json响应消息显示在白页中,并且我的帖子路径为url。

视图中的HTML代码:

{{1}}

enter image description here

2 个答案:

答案 0 :(得分:1)

HTML中有一个简单的拼写错误:

'

单引号#action都不应该存在,并且表示您的jQuery选择器与表单不匹配,因此您的Javascript实际上都没有触发。表单只是正常提交​​,因此您最终会使用id形式指定的网址。

id="ajax-inquire" 应指定为:

$()

附注:技术上并不重要,但您不需要在现有的jQuery对象上使用// Here you set form as a jQuery object var form = $('#ajax-inquire'); // You don't need "$(form)" here, "form" is all you need $(form).submit(function(event) { // You can simply use the existing jQuery object form.submit(function(event) { 。它的工作原理是因为jQuery接受一个jQuery对象作为选择器,但如果你没有以任何方式过滤或编辑选择器,它就是多余的。

select job_ID from JobCard Inner join Jobs On JobCard.job_ID = Job.job_ID where status = 'jobDone' group by Job.labor

答案 1 :(得分:0)

尝试将此返回:

$your_json= json_encode(['code'=>200,'success' => 'Your inquire is successfully sent.']);

return view('your_view',compact('your_json'));

然后在你的视图中:

{{json_decode($your_json)['success']}}