mmGrid使用及常用参数

html标签

 <div class="box-header with-border">   <button id="btnAdd" class="btn btn-success btn-sm" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">新增</button><button id="btnDelete" class="btn btn-warning btn-sm" οnclick="DeleteMutiRows()">删除</button><div class="box-tools pull-right" style="padding-right:60px"><input id="secucode" placeholder="查询条件:名称"><button id="btnSearch" class="btn btn-info btn-sm" style="margin-left:10px" οnclick="OnSearch()">搜索</button></div><!-- /.box-tools --></div>

<div class="box box-primary"><div class="box-body no-padding"><div class="mailbox-messages"><table id="mmg" class="mmg">/<tr><th rowspan="" colspan=""></th></tr></table><div id="pg" style="text-align: right;"></div></div><!-- /.mail-box-messages --></div><!-- /.box-body --></div>

JS设置表格样式和数据

<script>
$(document).ready(function() {var cols = [{name: 'USER_ID',hidden: true}, {title: '用户名',align: 'center',name: 'USER_NAME',width: 100,sortable: false}, {title: '账号',name: 'LOGIN_NAME',width: 100,align: 'center',sortable: false,}, {title: '密码',name: 'PASSWORD',width: 100,align: 'center',sortable: false}, {title: '电话',name: 'LINK_TEL',width: 100,align: 'center',sortable: false}, {title: '备注',name: 'NOTES',width: 100,align: 'center',sortable: false},{title: '管理员身份',name: 'IS_ADMIN',width: 100,align: 'center',sortable: false},{title: '权限',name: '',width: 200,align: 'center',sortable: false,cols:[{title: '浏览',align: 'center',name: 'IS_BROWSER',width: 50,sortable: false},{title: '操作',align: 'center',name: 'IS_OPER',width: 50,sortable: false},{title: '修改',align: 'center',name: 'IS_DATA_UPDATE',width: 50,sortable: false},{title: '调试',align: 'center',name: 'IS_DEBUG',width: 50,sortable: false}]},{title: '操作',name: '',width: 200,align: 'center',lockWidth: true,lockDisplay: true,renderer: function(val) {return '<button  class="btn btn-info btn-xs">修改密码</button> <button  class="btn btn-danger btn-xs">删除</button>';}}];mmg = $('.mmg').mmGrid({height: '400px',cols: cols,url:  ContentRoot + 'system/listUserInfoUserAction.do',method: 'post',remoteSort: false,multiSelect: true,checkCol: true,
            fullWidthRows: true,autoLoad: true,root: 'items',plugins: [  $('#pg').mmPaginator({limitList: [10, 15, 20, 30, 50]})],params: function() {//如果这里有验证，在验证失败时返回false则不执行AJAX查询。return {"userName": $("#secucode").val()}}});mmg.on('cellSelected', function(e, item, rowIndex, colIndex) {//查看if ($(e.target).is('.btn-info, .btnPrice')) {e.stopPropagation(); //阻止事件冒泡changePassword(item);//传入当前用户数据修改密码} else if ($(e.target).is('.btn-danger')) {e.stopPropagation(); //阻止事件冒泡//item["USER_ID"]中属性区分大小写DeleteData(item["USER_ID"], 1);}}).on('loadError', function(e, data) {mmg.load([]);mmg._showLoadError();});$(".wrapper").on('click', function(e) {$('.dropdown', window.parent.document).each(function() {var yes = $(this).hasClass("open");if (yes) {$(this).toggleClass("open");}});});});</script>

参数：

url: 数据请求地址

method: 请求方式

remoteSort: 是否使用服务器端排序

multiSelect: 设置表格是否可多选

checkCol: 可以再表格前加入选框列，和multiSelect搭配使用

fullWidthRows: 表格在第一次数据加载时计算列宽，将其充满整个表格

autoLoad: 表格准备好事加载数据

root: 指定json对象的数组字段为数据

plugins: 分页插件，插件必须实现 init($mmGrid)和params()方法，参考mmPaginator

表格效果

分页效果

mmGrid使用及常用参数相关推荐

2021年大数据Hadoop（二十九）：关于YARN常用参数设置
全网最详细的Hadoop文章系列,强烈建议收藏加关注! 后面更新文章都会列出历史文章目录,帮助大家回顾知识重点. 目录本系列历史文章前言关于yarn常用参数设置设置container分配最小内 ...
dataTables常用参数
一.新版本和老版本的区别新版本的改进:https://datatables.net/new/1.10 新老版本参数变化列表:http://datatables.club/upgrade/1.10-c ...
[Hive_add_8] Hive 常用参数配置
0. 说明记录 Hive 常用参数的配置 1. 设置本地模式让 Hive 自动使用 Hadoop 的本地模式运行作业,提升处理性能适合小文件,一般用于测试 set hive.exec.mode. ...
R语言使用knitr生成机器学习模型全流程步骤示例：knitr与自动化结果报告、knitr常用参数
R语言使用knitr生成机器学习模型全流程步骤示例:knitr与自动化结果报告.knitr常用参数目录
Maven常用参数及其说明
2019独角兽企业重金招聘Python工程师标准>>> Maven常用参数及其说明 -h,--help Display he ...
qemu使用实例和常用参数
=========================qemu使用实例参数详解========================= qemu.exe -kernel-kqemu -L . -m 512 -h ...
JVM面试问题系列：JVM 配置常用参数和常用 GC 调优策略
JVM 配置常用参数堆参数回收器参数如上表所示,目前主要有串行.并行和并发三种,对于大内存的应用而言,串行的性能太低,因此使用到的主要是并行和并发两种.并行和并发 GC 的策略通过 UsePar ...
mysql -s 参数_mysqldump 的常用参数。
mysqldump 常用参数详解: --databases:备份多个数据库,选项后跟多个库名.备份文件中会包含USE db_name. --events : 备份事件 --routines:备 ...
python把桢写入txt_ffmpeg 常用参数一览表及python 使用示例
FFmpeg是一套可以用来记录.转换数字音频.视频,并能将其转化为流的开源计算机程序.提供了录制.转换以及流化音视频的完整解决方案. 它包含了非常先进的音频/视频编解码库libavcodec,这里介绍 ...

mmGrid使用及常用参数

mmGrid使用及常用参数相关推荐

最新文章

热门文章