Laravel：是否可以将刀片视图加载到 jquery 模式中？答案

【问题标题】：Laravel: Is it possible to load blade view into a jquery modal?Laravel：是否可以将刀片视图加载到 jquery 模式中？
【发布时间】：2019-06-04 09:16:35
【问题描述】：

下面是我要加载到模态的主要刀片文件。

@extends('layouts.app')

@section('title', trans('pages.jobs.show.header_title') ?: trans('pages.jobs.show.title'))

@section('navigation')

@endsection

@section('content')
    <div class="container">
        <div class="page-dashboard">
            {{ all teh content loaded: such as SVG grapgh using JS }}
        </div>
    </div>

    <nav class="container-fluid nav-bottom" data-js="nav-bottom">

        <div class="nav-bottom__overlay"></div>

    </nav>    

    @push('scripts')
        <script src=""></script>
    @endpush
@endsection

我曾尝试使用 bootstarp.js 模态，但模态未加载，它会加载到主页中。

是否可以加载包含自己的CSS 和js 的整个刀片？

请提供任何示例。也许，我必须使用 ajax：

$('#modellink').click(function(){

            $.ajax({
                type : 'GET',
                url : $(this).data('path'),

                success: function(result, url) {

                    $('.modal-body').html(result);
                    $('#myModal').modal('show');

                    $('.modal-container').load($(this).data('path'),function(result){
                        $('#myModal').modal({show:true});
                    });
                }
             });
        });

【问题讨论】：

标签： php jquery laravel laravel-5 bootstrap-modal

【解决方案1】：

返回 HTML 字符串

// SomeController::getModal()
return view('layouts.someview', $data_array)->render();

将其加载到模态中

 $.ajax(
  // blah,
  // blah,
  success: function(response) {
    $('#modal').html(response)
  }
)

【讨论】：

【解决方案2】：

简而言之 - 是的。

我不确定您是如何加载模态的 - 因为您没有提供太多信息，但是，如果您可以将外部页面加载到模态中，那么只需指向显示刀片视图的 laravel 路由。

或者，使用 @include('modal.name.blade') 并将其作为页面的一部分，该页面使用带有正确 html/css 的模态，当然用于您的相关模态脚本。

【讨论】：

【解决方案3】：

如果您有一个文件调用 modal.blade.php，其中包含该模式的所有 HTML、CSS 和 JS，您可以将其包含在带有 @include("modal") 的任何页面上。例如：

modal.blade.php

<style>...</style>

<div class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">Modal title</h4>
            </div>
            <div class="modal-body">
                <p>One fine body&hellip;</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Save changes</button>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">...</script>

然后，在你的主文件中：

main.blade.php

@extends("layout")
@section("content")
@include("modal")
<div>...</div>

【讨论】：