Bootstrap-table 增删改查
发布时间:2020-12-17 21:19:29 所属栏目:安全 来源:网络整理
导读:1.引入bootstarp-table 系类的js/css文件 @*1、Jquery组件引用*@ script src="~/Scripts/jquery-1.10.2.js"/script @*2、bootstrap组件引用*@ script src="~/Content/bootstrap/bootstrap.js"/script link href="~/Content/bootstrap/bootstrap.css" rel="st
1.引入bootstarp-table 系类的js/css文件 @*1、Jquery组件引用*@ <script src="~/Scripts/jquery-1.10.2.js"></script> @*2、bootstrap组件引用*@ <script src="~/Content/bootstrap/bootstrap.js"></script> <link href="~/Content/bootstrap/bootstrap.css" rel="stylesheet" /> @*3、bootstrap table组件以及中文包的引用*@ <script src="~/Content/bootstrap-table/bootstrap-table.js"></script> <link href="~/Content/bootstrap-table/bootstrap-table.css" rel="stylesheet" /> <script src="~/Content/bootstrap-table/locale/bootstrap-table-zh-CN.js"></script> 2.定义一个空的table <table id="madArea_table"></table> 3.对table 初始化的js $(function () { //1.初始化Table var oTable = new TableInit(); oTable.Init(); } var TableInit = function () { var oTableInit = new Object(); //初始化Table oTableInit.Init = function () { $(‘#madArea_table‘).bootstrapTable(‘destroy‘); $(‘#madArea_table‘).bootstrapTable({ url: path,method: ‘post‘,//请求方式 sortName: "createTime",sortOrder: "desc",striped: true,// 是否显示行间隔色 pagination: true,// 是否分页 search: false,showExport: false,queryParams: queryParams,//传递参数(*) columns: [{ checkbox: true },{ title: ‘序号‘,//标题 可不加 align: "center",formatter: function (value,row,index) { return index + 1; } },{ field: ‘name‘,title: ‘名称‘ },{ field: ‘area‘,title: ‘划分‘ },{ field: ‘Code‘,title: ‘代码‘ },{ field: ‘createTime‘,title: ‘创建时间‘,sortable: true }] }); }; return oTableInit; }; //得到查询的参数 function queryParams(params) { var temp = { //这里的键的名字和控制器的变量名必须一直,这边改动,控制器也需要改成一样的 pageNum: Math.round((params.offset + params.limit) / params.limit),pageSize: params.limit,//名称 name: $("#input_name").val(),//划分 area: $("#input_area").val(),}; return temp; } (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |