时间戳

首页 > 解决方案 > 如何在 AJAX 插入为 Flash 消息后加载部分视图

jquery - 如何在 AJAX 插入为 Flash 消息后加载部分视图

问题描述

我的系统中有一个部分视图，我将其包含在我的所有视图中，然后显示我可能来自控制器的任何闪存消息。我刚开始使用 jQuery 并将记录动态插入到我的数据库中。

全部脚本有效（在其他地方找到并修改了它），我想更改加载 Flash 消息的方式，我不想在脚本部分的视图文件中指定它们，我想从我的控制器发送它们并加载我的部分视图就像我在其他页面上所做的那样。

我脚本的一部分；

        $('#submit').click(function () {
            $.ajax({
                url: postURL,
                method: "POST",
                data: $('#add_name').serialize(),
                type: 'json',
                success: function (data) {
                    if (data.error) {
                        printErrorMsg(data.error);
                    } else {
                        i = 1;
                        $('.dynamic-added').remove();
                        $('#add_name')[0].reset();
                        $(".print-success-msg").find("ul").html('');
                        $(".print-success-msg").css('display', 'block');
                        $(".print-error-msg").css('display', 'none');
                        $(".print-success-msg").find("ul").append(
                            '<li>New Project Space has been added</li>');
                    }
                }
            });
        });


        function printErrorMsg(msg) {
            $(".print-error-msg").find("ul").html('');
            $(".print-error-msg").css('display', 'block');
            $(".print-success-msg").css('display', 'none');
            $.each(msg, function (key, value) {
                $(".print-error-msg").find("ul").append('<li>' + value + '</li>');
            });
        }

控制器的一部分

    if ($validator->passes()) {
        foreach ($request->input('label') as $key => $value) {
            Space::create([
                'label'=>$value,
                'user_id' => $user,
                'customer_id' =>$customer,
                'project_id' => $projectid,
                ]);
        }
        return response()->json(['success'=>'done']);
    }

    return response()->json(['error'=>$validator->errors()->all()]);

部分的

@if ($message = Session::get('success'))
<div class="alertcontainer" id="alertcontainer">
<div class="alert alert-success alert-block">
    <button type="button" class="close" data-dismiss="alert">×</button>
        <strong>{{ $message }}</strong>
</div>
</div>

@endif

标签： jqueryajaxlaravelpartial-views

解决方案

Laravel 有一个非常酷的功能，允许您通过 ajax 从控制器加载部分视图到您的视图中。

创建一个局部视图，我们称之为partialDisplay。将您的 html、css 和任何带有 the$variable和 any<ul>的循环放入此视图中，并将其从 ajax 成功函数中取出。然后，您可以只调用您的部分并发送实际消息。

命名部分视图的一部分（比如“messageContent”）以供控制器调用。部分仍然可以加载任何基础视图或其他依赖项，但我们将专注于您需要的区域，messageContent

部分视图：

@extends('layouts.baseModal')

 @section('messageContent')
    // css, loops of data, etc go here
     @foreach($var as $v)
        <li>{{$v->somethingLikeNameOrmessage}}</li>
   // etc
 @stop

控制器：

$view = view('partialDisplay', compact('yourVar(s)'));

    $sections = $view->renderSections(); // returns an associative array of 'content', 'pageHeading' etc

    return $sections['messageContent']; // this will only return whats in the content section

然后，在ajax中，您可以只保留整个视图，完成格式化等：

success: function (html) {
       $("#yourMessageDiv").html(html);
 },

推荐阅读