jqgrid 插件的使用
首先设定table的id和分页
<div id=”gridList”></div> //table名称
<div id=”page”></div> //table分页
1.获取某一行的某个值
var RptID = $("#gridList").jqGridRowValue().RptID;
2.多选删除
获取到所有列表
var aa = $('#gridList').jqGrid('getGridParam', 'selarrrow');
RptIDs = aa.join(",");
删除操作多个:
$("#gridList").jqGrid('delRowData', RptIDs);
3.删除单个
var keyValue = $("#gridList").jqGridRowValue().GeneID;
4.分页操作
onPaging: function (pageBtn) {
var records = $("# gridList ").getGridParam('records');//获取返回的记录数
var page= $("# gridList ").getGridParam('page');//获取返回的当前页
var rowNum = $("# gridList ").getGridParam('rowNum'); //获取显示配置记录数量
var total = Math.ceil(records / rowNum); //
$("#gridList ").getGridParam('total');//获取总页数
var newurl = "/******?pageIndex=";
if (pageBtn === "next" && page < total) {
page = parseInt(page) + 1; $gridList.jqGrid("setGridParam", { url: newurl + page });
}
if (pageBtn === "prev" && page > 1) {
page = parseInt(page) - 1;
$gridList.jqGrid("setGridParam", { url: newurl + page });
}
if (pageBtn === "last") {
page = total;
$gridList.jqGrid("setGridParam", { url: newurl + page });
}
if (pageBtn === "first") {
page = 1;
$gridList.jqGrid("setGridParam", { url: newurl + page });
}
}
5.搜索操作
$("#drugName").on("input propertychange", function () { //#drugName是input的id
$gridList.jqGrid('setGridParam', {
postData: { drugName: $("#drugName").val() } //drugName 是后台接口的搜索参数
}).trigger('reloadGrid');
})
6.选中某行进行操作
onSelectRow: function (rowid, status) { //onSelectRow 当选择行时触发此事件。rowid:当前行id;status:选择状态,当multiselect 为true时此参数才可用
var rowData = $("#gridListDrug").jqGrid('getRowData', rowid); //获取到该行的id
var DrugName_CN = rowData.DrugName_CN; //得到自己所需要的值
if (DrugName_CN == "") {
$.modalAlert('这是提示语', 'error');
//$("#gridListDrug").jqGrid('resetSelection'); //取消掉所有选中操作,提示,是所有操作
$("#gridListDrug").setSelection(rowid, false); //取消掉该行选择
return;
}
},
7.加载完成时,进行操作,这个功能是选择完,记住自己的选择,仍然是选中状态
keyT是数组值
var item_selected = $.request("keyT").split(',');
gridComplete: function () { //当表格所有数据都加载完成而且其他的处理也都完成时触发此事件,排序,翻页同样也会触发此事件
var _this = this;
if (item_selected.length > 0) {
for (var i = 0; i < item_selected.length; i++) {
$(_this).jqGrid('setSelection', item_selected[i]);
}
}
},
8.更新当前窗口 $.currentWindow().$("#gridList").resetSelection();
$.currentWindow().$("#gridList").trigger("reloadGrid");
9.中文排序方法
//中文排序
function sortChinese(obj) { // 参数: 排序的数组
obj.sort(function (item1, item2) {
return item1.localeCompare(item2, 'zh-CN');
})
}
调用方法:sortChinese(myArraySort);
//myArraySort 是数组
jqgrid 插件的使用的更多相关文章
- jqGrid插件的重载表格的解决方案
jqGrid插件的重载表格的解决方案 $("#table_list_1").empty();// 清空表格内容 var parent=$("#gbox_table_lis ...
- js插件---jqGrid插件如何使用
js插件---jqGrid插件如何使用 一.总结 一句话总结:jqdrid还是依赖加js初始化的方式,很多时候插件的问题一般都是引入的css和js的问题,jqgrid里面遇到的问题就是下载包有一些js ...
- jqGrid插件getCol方法的一个改进
jgGrid插件是非常常用的一个基于jQuery的表格插件,功能非常强大.我最近也频繁使用.但是这个插件也有一些不够完善的地方.比如这个getCol方法. getCol方法接受三个参数 colname ...
- 后台CRUD管理jqGrid 插件下载、使用、demo演示
jqGrid:demo?version=5.2.1download src: http://www.trirand.com/blog/ github:https://github.com/tonyto ...
- [译]MVC网站教程(四):MVC4网站中集成jqGrid表格插件(系列完结)
目录 1. 介绍 2. 软件环境 3. 在运行示例代码之前(源代码 + 示例登陆帐号) 4. jqGrid和AJAX 5. GridSettings 6. ...
- jqGrid使用setColProp方法动态改变列属性
在使用jqGrid插件时,有时我们需要动态改变列的属性,可使用setColProp方法,用法如下 jQuery(”#grid_id”).setColProp('colname',{editoption ...
- 在ump系统的那半个多月-jqGrid
2012.04统一监控平台项目打酱油的日子 系统介绍: 目标,致力于服务于公司内部的所有系统,对所有接入监控的系统进行监控,包括系统监控,URL存活监控,端口存活监控,方法监控等. 作为打酱油的我,没 ...
- jqgrid使用简单记录
我要为id为jqGrid的table使用jqgrid插件. $("#jqGrid").jqGrid({ url: 'data/test.json', mtype: "GE ...
- 我和小美的撸码日记(2)之第一个基于MVC+Jqgrid的列表页面
一.前言 “尼玛哥,上周你教我改了下OA系统UI,黄总看了很满意呀.” “不错不错,看来小美进步很大,可以提前结束试用期,到时候加工资别忘了请我吃饭呀!” “尼玛哥,你有女朋友了吗?” “ ...
随机推荐
- TCP-IP详解笔记4
TCP-IP详解笔记4 系统配置: DHCP和自动配置 每台主机和路由器需要一定的配置信息,配置信息用于为系统指定本地名称,及为接口指定标识符(如IP地址). 提供或使用各种网络服务,域名系统(DNS ...
- vs调试的时候,指定的参数已超出有效值的范围。参数名:sit ,先仔细看看错误和我的一样不一样
https://www.cnblogs.com/pei123/p/7694947.html 指定的参数已超出有效值的范围.参数名:sit ,先仔细看看错误和我的一样不一样 更新了1709就这样了,的确 ...
- Java Spring Boot VS .NetCore (四)数据库操作 Spring Data JPA vs EFCore
Java Spring Boot VS .NetCore (一)来一个简单的 Hello World Java Spring Boot VS .NetCore (二)实现一个过滤器Filter Jav ...
- powershell 激活WIN10
1.以win10专业版为例,鼠标右键点击开始图标,选择[windows powershell(管理员)],或者命令提示符管理员:2.打开命令窗口,复制这个命令slmgr /ipk W269N-WFGW ...
- Hadoop生态组件Hive,Sqoop安装及Sqoop从HDFS/hive抽取数据到关系型数据库Mysql
一般Hive依赖关系型数据库Mysql,故先安装Mysql $: yum install mysql-server mysql-client [yum安装] $: /etc/init.d/mysqld ...
- VM下新建虚拟机并装linux系统
一.新建虚拟机 1.选择典型----> 2.选择稍后安装操作系统---> 3.选择操作系统和版本----> 4.选择虚拟机存放位置---> 5.配置虚拟机---> 二.l ...
- 从Github上将laravel项目拉到新开发环境
1.从github上将项目拉到本地 默认主分支:git clone https://github.com/my-user-name/my-project /home/vagrant/laravel/ ...
- 权限管理——shiro
1.shiro整合spring a.导入依赖 <properties> <shiro.version>1.2.4</shiro.version> </prop ...
- React实现局部刷新
[项目结构] 流程: 入口文件 -> 路由 -> layout -> Analysi/Monitor/Workspace 1.入口文件 -> src/index.js 2.组件 ...
- 一天带你入门到放弃vue.js(三)
自定义指令 在上面学习了自定义组件接下来看一下自定义指令 自己新建的标签赋予特殊功能的是组件,而指定是在标签上使用类似于属性,以v-name开头,v-on,v-if...是系统指令! v-是表示这是v ...