Контроллер Laravel возвращает полный просмотр (при обновлении) или частичный просмотр html (при вызове ajax) - PullRequest
Новая
       13

Контроллер Laravel возвращает полный просмотр (при обновлении) или частичный просмотр html (при вызове ajax)

0 голосов
/ 14 мая 2019

Цель: когда пользователь обновляет страницу, он возвращает полный вид страницы (шаблонный блэйд, основной блэйд, вспомогательный блэйд ...) или, когда пользователь щелкает ссылку, он возвращает только частичный просмотр (вспомогательный блэйд) страницы. .

Я заблудился, как структурировать код, чтобы это произошло.

Текущий код работает так, как если пользователь обновит страницу или щелкнет ссылку, он вернет подвид ТОЛЬКО страницы. Как использовать «yield», «extended» и «section» или другие способы достижения этого?

(* Обратите внимание, что у меня нет выхода, расширения, сечения в дополнительном блейде для расширения основного блейда, поэтому он возвращает только вложенный html.)

это шаблон blade.php 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    @yield('data.csrf')
    <!-- Title Page-->
    <title>{{ ucfirst($title ?? '') }}</title>
    <!-- Main CSS-->
    <link href="{{ asset('/css/theme.css') }}" rel="stylesheet" media="all">
</head>
<body class="animsition">
    <div class="page-wrapper">
        <div class="page-content--bgf7">
            @yield('main')                  //yield the main blade
            @include('template.footer')
        </div>
    </div>

<!-- Jquery JS-->
<script src="{{ asset('/vendor/jquery-3.2.1.min.js') }}"></script>
@yield('js-script')                         //yield the main blade js
</body>
</html>

это основной файл blade.php 

@extends('template')

@section('main')
<section>
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="title-3"><i class="fa fa-hdd-o"></i>Data</h3>
                    </div>
                    <div class="card-body">
                        <ul class="nav nav-pills">
                            <li class="nav-item">
                                <a class="nav-link" href="{{ route('getSubPage1',['id'=> $id]) }}">Subpage1</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link"  href="{{ route('getSubPage2',['id'=> $id]) }}">Subpage2</a>
                            </li>
                        </ul>
                    </div>
                    <section id="devices-tabs">
                            <div id="devices-tabs-content"></div>
                            @yield('sub')               //yield the sub blade
                    </section>
                </div>
            </div>
        </div>
    </div>
</section>

@stop


@section('js-script')
<script type="text/javascript">

    $(document).ready(function(){
        //trigger if any tab is clicked
        $('.nav-link').click(function(event) {

            //prevent default href event 
            event.preventDefault();
            event.stopPropagation();

            var linkURL = $(this).attr('href');
            //ajax call to return partial view 
            $.ajax({
                method: 'GET',
                url: linkURL,
                datatype: 'html',
                success: function(data) {
                    if(data.success == true) {
                      if(linkURL!=window.location){
                            $(document).attr("title", data.title);
                            window.history.pushState({path:linkURL},'',linkURL);
                        }
                      $('#devices-tabs-content').html(data.html);
                    } else {
                        alert('somethingwrong!!');
                    }
                }
            });
       });
    });
</script>
@stop

это sub blade.php 

<div class="card-body">
    <div class="table-responsive">
        <table class="table">
            <thead>
                <tr>
                    <th>header1</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>{{$myValue}}</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

это контроллер в ответ на щелчок (запрос ajax) или обновление 

public function getSubPage1($id,Request $request)
{

    $data = new Data();
    $value = $data::queryValue($id);

    $data=array('myValue'=>$value);

    //return for partial sub view if ajax call 
    if($request->ajax()){
        $returnHTML = view('sub')->with($data)->render();
        return response()->json(array('success' => true, 'html'=>$returnHTML, 'title'=>'Subpage1'));
    }

    //return full view 
    return view('sub')->with($data); 
}
...