【问题标题】:How to add Laravel datatable(yajra) to existing project?如何将 Laravel 数据表(yajra)添加到现有项目中?
【发布时间】:2021-03-21 06:26:41
【问题描述】:

是否有任何可能的方式将 yajra 数据表添加到现有项目? 如果我将它实现到空白 view.blade.php 效果很好,但如果我把它放到我现有的项目中,它只会显示广告。

我的控制器:

 namespace App\Http\Controllers;

use App\Models\User;
use Illuminate\Http\Request;
use Yajra\DataTables\DataTables;


class UserRecordController extends Controller
{
    public function __construct()
    {
        $this->middleware(['role:admin']);
    }

    public function show()
    {
        $data = User::all()->all();

        return view('management.admin-only.users.users_record')->with('data', $data);
    }

    public function index(Request $request)
    {
        if ($request->ajax()) {
            $data = User::all()->all();
            return Datatables::of($data)
                ->addIndexColumn()
                ->addColumn('action', function($row){

                    $btn = '<a href="javascript:void(0)" class="edit btn btn-primary btn-sm">View</a>';

                    return $btn;
                })
                ->rawColumns(['action'])
                ->make(true);
        }

        return view('management.admin-only.users.users_record');
    }
}

我的看法:

@extends('layouts.app')

@section('content')
    <div class="row admin-panel">
        @include('management.common.admin_sidebar')
        <div class="col" id="main">
            <div class="card panel-stats">
                <div class="card-body">
                    <div class="flash-message">
                        @foreach (['danger', 'warning', 'success', 'info'] as $msg)
                            @if(Session::has('alert-' . $msg))
                                <p class="alert alert-{{ $msg }}">{{ Session::get('alert-' . $msg) }} <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a></p>
                            @endif
                        @endforeach
                    </div>
                    <div class="card-title">
                        <div class="card-body">
                            <div class="card-body">
                                <h2><img class="py-2 mr-3" height="100px" width="auto" src="{{ asset('img/admin/group.jpg') }}">Users</h2>
                            </div>

                            <a href="{{Route('users_add')}}" class="btn btn-outline-success">Add user</a>

                            <a href="" id="user-edit" onclick="" class="btn btn-outline-primary" data-toggle="tooltip" data-placement="top" title="Choose 1 user to edit">Edit user</a>
                            <a href="" id="user-delete" onclick="return confirmation()" class="btn btn-outline-danger" data-toggle="tooltip" data-placement="top" title="Choose 1 user to delete">Delete user</a>


                        </div>
                        <div class="card-body">
                                <div class="card">
                                    <table class="table table-responsive-md table-striped table-hover data-table" id="users-table">
                                        <thead>
                                        <tr>
                                            <th>#</th>
                                            <th>Firstname</th>
                                            <th>Lastname</th>
                                            <th>E-mail</th>
                                            <th>Add date</th>
                                            <th>Option</th>
                                        </tr>
                                        </thead>
                                        <tbody>

                                        </tbody>
                                    </table>
                                </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
        $(function () {

            var table = $('.data-table').DataTable({
                processing: true,
                serverSide: true,
                ajax: "{{ route('users_record') }}",
                columns: [
                    {data: 'id', name: 'id'},
                    {data: 'firstname', name: 'firstname'},
                    {data: 'surname', name: 'surname'},
                    {data: 'email', name: 'email'},
                    {data: 'created_at', name: 'created_at'},
                    {data: 'action', name: 'action', orderable: false, searchable: false},
                ]
            });

        });

        function changeUrl(el){
            let urlEdit = '{{Route("users_edit_form", ":id" )}}';
                urlEdit = urlEdit.replace(':id', el.value);

            let urlDelete = '{{Route("users_delete_form", ":id" )}}';
                urlDelete = urlDelete.replace(':id', el.value);

            document.getElementById('user-edit').href = urlEdit;
            document.getElementById('user-delete').href = urlDelete;
        }

        function checkIfChecked(){
            if(document.getElementById('id-selected').checked)
            {
                console.log(document.getElementById('id-selected').value);
                return true
            }
            else
            {
                console.log(document.getElementById('id-selected').value);
                alert('Choose user to edit/delete!');
                return false
            }
        }

        function confirmation(){
            let message = confirm("Are you sure?");
            if(message)
                return true;
            else
                return false;
        }


    </script>

@endsection

我的路线:

Route::get('/admin_panel/users_record','UserRecordController@index')->name('users_record');

我使用了多个教程 - 每个看起来都相似。我刚刚将所有必要的 webpack 导入 app.blade.php。

我做错了什么?

【问题讨论】:

    标签: php laravel datatables frameworks yajra-datatable


    【解决方案1】:

    你需要两个功能,一个是用于加载视图

    public function index(){
    return view('management.admin-only.users.users_record');
    }
    

    和另一个获取数据的函数

    public function get_users_record(Request $request){
     if ($request->ajax()) {
            $data = User::all()->all();
            return Datatables::of($data)
                ->addIndexColumn()
                ->addColumn('action', function($row){
    
                    $btn = '<a href="javascript:void(0)" class="edit btn btn-primary btn-sm">View</a>';
    
                    return $btn;
                })
                ->rawColumns(['action'])
                ->make(true);
        }
    }
    

    路线将是

    Route::get('/admin_panel/users_record','UserRecordController@index')->name('users_record');
        Route::get('/admin_panel/get_users_record','UserRecordController@get_users_record')->name('get_users_record');
    

    和ajax url应该是

     ajax: "{{ route('get_users_record') }}",
    

    【讨论】:

    • 应该有 2 条路由 1?
    • 是的。一个用于加载页面,另一个用于加载将是 ajax url 的数据
    • 我添加了另一个函数,但它仍然不显示数据 :( 当我使用构建的 @foreach 正常工作并从它显示的模型返回数据以查看时,但我决定添加动态表...
    • 在这条路线/admin_panel/get_users_record你得到数据了吗?
    • 好吧。然后把你的控制器代码放在外面。用于测试目的。在这条路线中,您将获得将加载到视图表中的 json 数据
    猜你喜欢
    • 2021-01-13
    • 2017-06-01
    • 2020-03-03
    • 2021-12-31
    • 1970-01-01
    • 2012-05-06
    • 2018-11-14
    • 2012-11-25
    • 2019-02-15
    相关资源
    最近更新 更多