<script type="text/html" id="toolbarDemo">
 <div class="layui-btn-container">
 <button class="layui-btn layui-btn-sm" lay-event="getSelect">查詢</button>
 <button class="layui-btn layui-btn-sm" lay-event="getInsert">新增</button>
 <button class="layui-btn layui-btn-sm" lay-event="getUpdate">修改</button>
 <button class="layui-btn layui-btn-sm" lay-event="getDelete">刪除</button>
 <button class="layui-btn layui-btn-sm" lay-event="getRefresh">刷新</button>
 </div>
</script>

<link href="~/Contents/assets/layui/css/layui.css" rel="external nofollow" rel="stylesheet" />
<script src="~/Contents/js/jquery-3.3.1.min.js"></script>
<script src="~/Contents/assets/layui/layui.all.js"></script>


layui.use('table', function () {
 var table = layui.table;
 table.render({
 elem: '#table',
 url: 'SelectDepartment', //數(shù)據(jù)接口
 page: true, //開啟分頁
 cols: [[ //表頭
  { type: 'numbers', title: '序號', align: 'center', width: 100 },
  { field: 'DepartmentNumber', title: '部門編號', align: 'center' },
  { field: 'Department', title: '部門名稱', align: 'center' }
 ]],
 id: 'table',
 toolbar: '#toolbarDemo',//開啟自定義工具行，指向自定義工具欄模板選擇器
 defaultToolbar: ['filter', 'print', 'exports']
 });
});