jqgrid使用:常用属性用法和含义
1. 如何获取grid选中的行的ID?
Javascript代码
var rowid = $( "#searchResultList" ).getGridParam( "selrow" );
var rowid = $("#searchResultList").getGridParam("selrow");
2. 如何在表格中动态增加一行数据?
Javascript代码
//$("#jqgrid").addRowData(rowId, data, pos, idx);
//pos可以为[first,last,before,after],为后两者是需要指定相对的行ID
$( "#jqgrid" ).addRowData( "1" , { "name" : "test" , "age" :12}, "first" );
//$("#jqgrid").addRowData(rowId, data, pos, idx);
//pos可以为[first,last,before,after],为后两者是需要指定相对的行ID
$("#jqgrid").addRowData("1", {"name":"test","age":12}, "first");
3. 如何动态修改某行的数据内容,如某几列的值?
Javascript代码
//setRowData( rowid, data );
$( "#jqgrid" ).setRowData( "1" , { tax: "5" , total: "205" });
//setRowData( rowid, data );
$("#jqgrid").setRowData( "1", { tax:"5", total:"205" });
4. jqgrid的常用属性?
Javascript代码
$( "#jqgrid" ).jqGrid({
url: "${ctx}/sys/role/search.dm" ,
colNames:[ "角色名称" ], //,"角色代码"
colModel:[ "roleName" ], //"roleCode"还可以用对象替换
jsonReader:{id: "roleId" ,root: "dataList" },
width:240,
height:250,
rowNum:20, //每页20条记录
pager: "logListPager" , //分页显示的DIVID
sortname: "actionTime" , //默认排序的列名
sortorder: "desc" , //默认排序的顺序
scroll: true , //鼠标滚动翻页
onSelectRow: function (rowid) {}
});
$("#jqgrid").jqGrid({
url:"${ctx}/sys/role/search.dm",
colNames:["角色名称"],//,"角色代码"
colModel:["roleName"],//"roleCode"还可以用对象替换
jsonReader:{id:"roleId",root:"dataList"},
width:240,
height:250,
rowNum:20,//每页20条记录
pager: "logListPager",//分页显示的DIVID
sortname: "actionTime",//默认排序的列名
sortorder: "desc",//默认排序的顺序
scroll:true,//鼠标滚动翻页
onSelectRow: function(rowid) {}
});
5. 获取某一行的数据对象?
Javascript代码
var rowid = $( "#searchResultList" ).getGridParam( "selrow" );
var rowData = $( "#searchResultList" ).getRowData(rowid);
var rowid = $("#searchResultList").getGridParam("selrow");
var rowData = $("#searchResultList").getRowData(rowid);
6. 如何使用API动态修改选中的行?
Javascript代码
//true:重新加载表格数据, false:不重新加载表格数据
$( "#jqGrid" ).setSelection( "1" , true );
//true:重新加载表格数据, false:不重新加载表格数据
$("#jqGrid").setSelection("1", true);
7.如何获取某一列的值
Javascript代码
var col= jQuery("#jqGrid ").jqGrid('getCol',4,false);//获取第4列的值
var col= jQuery("#jqGrid ").jqGrid('getCol','name',false);//获取列名为name的列的值
8.如何删除一行或多行
var selectedId = $("#gridTable").jqGrid("getGridParam", "selrow");
$("#gridTable").jqGrid('delRowData', selectedId);
还有以下常用的API,
Javascript代码
$( "#jqgrid" ).resetSelection();
$( "#jqgrid" ).clearGridData();
$( "#jqgrid" ).setCell(rowid,colname,nData,cssp,attrp);
本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/lijun2030/archive/2010/10/22/5959416.aspx
分享到:
相关推荐
### jqGrid 分页参数详解 #### 一、引言 在Web应用开发中,数据展示是必不可少的一个环节。为了提供更好的用户体验以及优化服务器资源利用,前端分页技术...希望本文能帮助大家更好地理解和使用`jqGrid`中的分页功能。
### jqGrid 属性中文详细说明 #### 一、简介 jqGrid是一款非常强大的jQuery插件,主要用于在网页上实现表格数据展示与管理的功能。通过设置不同的属性,可以灵活地控制表格的表现形式和交互行为,满足各种复杂的...
### jqGrid超详细属性说明(追加整理) #### 概述 `jqGrid`是一款功能强大的jQuery插件,主要用于在Web应用中展示表格数据。它不仅支持多种数据格式(如XML、JSON等),还提供了丰富的配置选项来实现复杂的前端交互...
jqGrid的搜索功能还可以与其他特性结合使用,如分页、排序和过滤。通过` postData`参数,可以传递额外的参数到服务器,以实现基于搜索条件的动态数据加载。 ```javascript $("#gridId").jqGrid({ url: 'server....
接下来,创建一个HTML表格元素,然后使用jqGrid的`$("#tableID").jqGrid()`方法初始化表格,配置相关参数,例如数据源、列定义等。 ```html <table id="grid"></table> <div id="pager"></div> ``` ```javascript ...
下面是 JQGrid 的一些关键特点和使用方法。 JQGrid 的特点 * 外观时髦,功能齐全 * JS 控件,用来显示和操作表格数据 * 使用 AJAX 方式 * 可以被集成到任何服务器端技术,例如 ASP, JavaServelets, JSP, PHP 等等 ...
在网页开发中,jQGrid是一款非常流行的JavaScript库,用于创建功能丰富的表格。它提供了许多高级功能,如数据检索、排序、过滤、编辑等。在某些场景下,我们需要动态地填充select下拉框的选项值,以实现更灵活的数据...
jQgrid 属性中文配置文档 jqGrid 是一个功能强大且灵活的 JavaScript 库,用于构建交互式网格控件。它提供了许多属性来配置网格的行为和外观。下面是jqGrid的一些重要属性的配置文档。 ajaxGridOptions jqGrid 的 ...
jqGrid表格属性大全 jqGrid是基于jQuery的表格控件库,它提供了许多有用的属性和方法来操作HTML表格。下面是jqGrid表格属性大全的详细介绍: Table对象 Table对象是jqGrid中的一个基本对象,表示HTML文档中的表,...
jqGrid是一款功能强大的JavaScript表格插件,用于在网页上展示和操作数据。...希望这个jqGrid的使用示例能帮助你更好地理解和应用这个插件。在实际开发中,记得不断学习和探索,以充分利用其潜力。
以下是对jqGrid常用属性的详细说明: 1. **colModel**:这是jqGrid最重要的配置之一,用于定义表格列的属性。每个列都有一个对象,包含列名(name)、标题(title)、宽度(width)等属性,还可以设置是否可编辑...
下面将详细解释jqGrid的一些关键属性和使用方法。 首先,jqGrid的核心组件包括以下几个JavaScript文件: 1. `jquery.js`:jQuery库,基础脚本。 2. `jquery.jqGrid.js`:jqGrid主文件,包含了所有基本功能,根据...
jQgrid 使用帮助 jQgrid 是一个功能强大且灵活的表格控件,能够将数据动态地展示在网页上,并提供了丰富的编辑、增删查改、分类显示等功能。下面是对 jQgrid 的详细介绍: jQgrid 包说明 jQgrid 主要由以下几个包...
jqGrid 是一个强大的JavaScript...总的来说,jqGrid Ace使用手册将详细解释如何配置和操作这个组件,以满足各种数据展示和交互需求。通过深入学习和实践,开发者能够有效地在网页应用中构建功能丰富的数据管理界面。
为了更好地定制和使用jqGrid,了解其各种属性的具体含义与作用是非常有必要的。 #### 二、详细属性说明 **1. ajaxGridOptions** - **参数值类型**:Object - **描述内容**:此选项用于设置全局的Ajax请求配置。...
jqGrid中文说明,对jQgrid表格关键使用方法中文说明 jqGrid是基于jQuery的数据表格插件,用于将需要展示的数据动态的展示在页面上,即动态画出表格,并封装了增、删、改、查、分类显示、在线编辑修改等功能。下面将...
使用`jQuery("#list").jqGrid()`方法创建表格,其中`#list`是表格的ID。配置参数如`viewrecords: true`,表示是否显示当前数据的总数;`imgpath`设置图片路径;`caption`定义表格标题。 4. **表格样式与行为**: ...
- **搜索功能**:使用 `searchGrid` 方法启用高级搜索功能。 - **导出数据**:可以导出表格数据到 CSV、Excel 或 PDF。 - **自定义行为**:通过事件监听器如 `loadComplete`、`onSelectRow` 进行扩展。 ### 5. ...
jqGrid尤其在Web应用程序中,与后端如Struts2等框架结合使用时,能够提供高效的数据展示和管理。 在“jqGrid中文大全(1)”这个压缩包中,包含了一系列关于jqGrid的中文教程和文档,这些资料可以帮助开发者更深入地...