laravel yajra插件 datatable的使用详解
作者:sileaf 时间:2023-11-18 20:05:06
安装laravel框架
命令行cd进入指定目录下,执行
composer create-project --prefer-dist laravel/laravel datatable
在指定目录下创建最新的laravel项目框架
安装yajra插件
命令行cd进入项目根目录下,执行
composer require yajra/laravel-datatables-oracle
安装yajra datatables软件包
发布yajra datatables软件包
打开config/app.php文件,修改providers和aliases配置
'providers' => [
....
Yajra\DataTables\DataTablesServiceProvider::class,
]
'aliases' => [
....
'DataTables' => Yajra\DataTables\Facades\DataTables::class,
]
view的创建
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Laravel-datatable</title>
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap" rel="external nofollow" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.10.23/datatables.min.css" rel="external nofollow" />
<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.23/datatables.min.js"></script>
<style>
body {
font-family: 'Nunito';
}
</style>
</head>
<body class="antialiased">
{{\Carbon\Carbon::now()}}
<table id="example">
<thead>
<tr>
<th></th>
<th>姓名</th>
<th>生日</th>
<th>性别</th>
<th>工作</th>
<th>电话</th>
<th>邮箱</th>
<th>地址</th>
</tr>
</thead>
</table>
</body>
<script>
$(document).ready(function (){
let datatable = $('#example').DataTable({
searching:false,
paging:false,
ajax:{
url:"{{route('getData')}}",
},
columns:[
{
data:"id",
name:"id",
},
{
data:"name",
name:"name",
},
{
data:"birthday",
name:"birthday",
},
{
data:"sex",
name:"sex",
},
{
data:"job",
name:"job",
},
{
data:"tel",
name:"tel",
},
{
data:"email",
name:"email",
},
{
data:"address",
name:"address",
},
],
});
});
</script>
</html>
创建控制器
cmd执行
php artisan make:controller DatatableController
设定路由并编辑控制器
//web.php文件
Route::get('/datatable',[App\Http\Controllers\DatatableController::class,'index']);
Route::get('/datatable',[App\Http\Controllers\DatatableController::class,'getData'])->name('getData');
//控制器
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\DB;
class DatatableController extends Controller
{
public function index(){
return view('welcome');
}
public function getData(){
$datas = DB::table('user')->select('*')->get();
return datatables()->of($datas)
->editColumn('id', '<input type="hidden" value="{{$id}}"><input type="checkbox" name="select">')->editColumn('name', '{{$name}}')
->editColumn('birthday', '{{$birthday}}')->editColumn('sex', '{{$sex}}')
->editColumn('job', '{{$job}}')->editColumn('tel', '{{$tel}}')
->editColumn('email', '{{$email}}')->editColumn('address', '{{$address}}')
->escapeColumns([])->make(true);
}
}
效果图
来源:https://blog.csdn.net/weixin_53889778/article/details/112513252
标签:laravel,yajra,插件,datatable
0
投稿
猜你喜欢
MySQL中导出用户权限设置的脚本分享
2024-01-21 15:29:04
Flask框架利用Echarts实现绘制图形
2023-01-08 11:52:42
pandas 使用apply同时处理两列数据的方法
2021-09-27 07:35:30
MySQL全局锁和表锁的深入理解
2024-01-24 00:48:53
Python 统计数据集标签的类别及数目操作
2023-04-08 12:04:09
python3.7添加dlib模块的方法
2023-09-16 03:58:55
Django处理多用户类型的方法介绍
2022-11-30 10:16:54
python虚拟环境完美部署教程
2021-09-10 17:54:02
python文件和目录操作方法大全(含实例)
2021-11-11 14:10:29
Python匿名函数/排序函数/过滤函数/映射函数/递归/二分法
2022-03-10 21:04:56
Python如何实现大型数组运算(使用NumPy)
2023-05-11 21:49:05
python 函数进阶之闭包函数
2021-07-21 03:21:29
MySQL into_Mysql中replace与replace into用法案例详解
2024-01-26 20:10:00
学会python自动收发邮件 代替你问候女友
2023-07-08 17:01:49
python输出电脑上所有的串口名的方法
2022-06-23 20:56:03
JS实现六边形3D拖拽翻转效果的方法
2023-08-28 15:51:31
树莓派(python)与arduino串口通信的详细步骤
2022-05-29 15:31:06
Python爬取百度翻译实现中英互译功能
2023-04-29 08:32:26
Python WXPY实现微信监控报警功能的代码
2021-05-15 02:07:20
Vue项目中props传值时子组件检测不到的问题及解决
2024-06-05 15:31:36