将表格转为jqGrid

评论(0)浏览(319)分类:jqGrid中文API
将表格转为jqGrid描述将存在的html表格转为grid作者Peter Romianowski安装要使用这个方法,需要在下载页面勾选Table to Grid模块后再下载jqGrid,下载地址:http://www.trirand.com/blog/?page_id=6。源文件grid.tbltogrid.js在src目录中。调用方式tableToGrid(selector, options)此方法为函数,不是方法。方法参数说明selector(string) :有效的table选择器(cs..

jqGrid导入和导出

评论(0)浏览(1381)分类:jqGrid中文API
jqGrid导入和导出  有些时候将表格的全部配置导入或者导出到另外一种格式将比较有用在服务器端构造的表格,在排序或者分页后可以重新构造,所以如果需要,不同的配置可以立马启用可以通过服务器端构造表格视觉,然后从xml字符中加载表格的配置可以作为xml保存到数据库中,然后从数据库中加载  jqGrid可以一次性加载配置和数据。安装要使用这个方法,需要在下..

jqGrid页头分组

评论(0)浏览(4258)分类:jqGrid中文API
jqGrid页头分组通用规则页头分组就是在表头行上增加附加的列,将需要分组列归并到一起,效果如下  有2种类型的分组方式,colSpan启用或者禁用。默认为禁用,没有分组的列表头上增加一个空白的行,如上所示的Notes列。启用colSpan,那么不会在没有分组的列上增加空白行,此列的表头作为一个整体(如上面的Notes列的2行合并到一起,如最下面那张图所示)下面将..

javascript鼠标滚轮滚动事件

评论(0)浏览(2021)分类:JavaScript/Ajax开发技巧
javascript鼠标滚轮滚动事件   javascript如何绑定对象的鼠标滚轮事件,对对象触发鼠标滚轮事件时,如何阻止鼠标滚轮事件冒泡,不允许当前视窗滚动。  下面对主流浏览器进行了测试(firefox12,opera12.5,safari5.0.4,chrome25,IE7~8)事件如何绑定  firefox只支持DOMMouseScroll事件,不支持onmousewheel,其他浏览器只支持onmousewheel事件,如下表所示浏览器/事..

jqGrid工具栏查询

评论(0)浏览(2922)分类:jqGrid中文API
jqGrid工具栏查询  这个方法在grid表头下面构造搜索表单。当表头改变宽度,搜索元素也会自动调整大小适应新表头宽度。此方法使用jqGrid配置的url作为查询服务器获取数据的接口。当执行查询时,键值对对象被提交到服务器(配置的url地址),此数据附加到postData参数,仅提交输入过内容的字段。当清空查询表单,附加的数据会从postData中删除。提交服务器的数据..

jplayer使用说明文档API

评论(0)浏览(2791)分类:JavaScript/Ajax开发技巧
jplayer使用说明文档APIjPlayer 2.1.0 开发指南如果你第一次使用jPlayer,请参考入门指南( Quick Start Guide)。有其他问题,查看支持页面的FAQ。jPlayer API中文文档jPlayer 基础jPlayer支持的媚态格式Setting the size of jPlayerFlash Security RulesMedia EncodingServer ResponseHow to disable jPlayer with CSS or jQueryjPlayer FilesPlugin FilesSource Fil..

jqGrid数据分组

评论(0)浏览(3292)分类:jqGrid中文API
jqGrid数据分组通用规则  按照不同标准对数据进行分组,目前只支持一个级别的分组。在jqGrid中配置grouping:true,groupingView:{groupField:需要分组的列名称(来自colModel的name)},启用分组功能。  如果你希望正确分组,服务器返回的数据需要按照配置的列排序过。如果为本地模式(local mode ,data为数组),数据会自动分组(排序),不需要定义任何..

jqGrid frozencolumn

评论(0)浏览(3371)分类:jqGrid中文API
jqGrid frozencolumn  开发者很容易冻结/锁定jqGrid的一些列。锁定的列不会滚动出可见区域当滚动jqGrid的水平滚动条时,这样如果有很多列grid出现水平滚动条时,可以保持某些列始终可见。设置  首先需要设置哪些列需要冻结或者锁定,可以在colModel中设置frozen:true,下面为示例jQuery(#grid).jqGrid({//... colNames: ['Date', 'Client', ..

jqGrid treegrid配置

评论(0)浏览(8141)分类:jqGrid中文API
jqGrid treegrid配置  树形表格用于显示在jqGrid中显示分层数据。树形表格支持嵌套集合模型( Nested Set model )和邻接模型(Adjacency model)。描述嵌套集合模型的相关文章推荐http://ftp.ntu.edu.tw/MySQL/tech-resources/articles/hierarchical-data.htmlhttp://www.sitepoint.com/article/hierarchical-data-database分层数据管理-嵌套集合模型分层数据管理..

jqGrid:treeGrid嵌套集合模型

评论(0)浏览(2588)分类:jqGrid中文API
jqGrid:treeGrid嵌套集合模型  如jqGrid treegrid配置中提到的,treeReader属性很重要。了解分层数据管理-嵌套集合模式的基本概念,将会更容易配置这个属性。treeReader配置  默认嵌套集合模型的(nested set model)treeReader配置如下treeReader : { level_field: level, left_field:lft, right_field: rgt, leaf_field: isLeaf, expanded_field: expa..

jqGrid:treeGrid邻接模型

评论(0)浏览(2006)分类:jqGrid中文API
jqGrid:treeGrid邻接模型  如jqGrid treegrid配置中提到的,treeReader属性很重要。了解分层数据管理-邻接表模型模式的基本概念,将会更容易配置这个属性。treeReader配置  默认邻接模型的(adjacency model)treeReader配置如下treeReader = { level_field: level, parent_id_field: parent, // then why does your table use parent_id? leaf_field: isLeaf..

jqGrid方法

评论(0)浏览(5302)分类:jqGrid中文API
jqGrid方法  本章介绍jqGrid基础方法。一些方法需要加载额外的模块。为了兼容jQuery UI类库,jqGrid3.6+使用新API来调用方法。相关信息: jqGrid事件grid相关方法调用方式jQuery(#grid_id).jqGridMethod( parameter1,...parameterN );示例说明grid_id :已经调用jqGrid方法构造过的DOM对象idjqGridMethod :属于jqGrid的方法名称parameter1,parameterN :..

Grid作为Subgrid

评论(0)浏览(1922)分类:jqGrid中文API
Grid作为Subgrid  此方法和事件比较像解决方案,而不是专门的方法。作为子表格的替代,调用父表格subGrid方法创建的为一个表格,不是子表格,拥有父表格的所有属性和功能,只是出现在展开记录的下面,效果如下图所示安装要使用这个方法,需要在下载页面勾选Subgrid后再下载jqGrid,下载地址:http://www.trirand.com/blog/?page_id=6。源文件grid.subgrid.js在..

CSS2,css3选择器总结

评论(0)浏览(117)分类:HTML/CSS兼容/XML
CSS2,css3选择器总结CSS选择器笔记阮一峰 整理参考网址:456 Berea Street一、基本选择器序号选择器含义1.*通用元素选择器,匹配任何元素2.E标签选择器,匹配所有使用E标签的元素3..infoclass选择器,匹配所有class属性中包含info的元素4.#footerid选择器,匹配所有id属性等于footer的元素实例: * { margin:0; padding:0; } p { font-size:2em; } .info {..

jqGrid subGrid配置

评论(0)浏览(4249)分类:jqGrid中文API
jqGrid subGrid配置  有些时候需要显示(或者编辑)父表格中选中行的子元素,jqGrid两种操作方法操作子记录。子表格(subGrid)一个grid对象作为子表格(subGrid)安装要使用这个方法,需要在下载页面勾选Subgrid后再下载jqGrid,下载地址:http://www.trirand.com/blog/?page_id=6。源文件grid.subgrid.js在src目录中。属性SubGrids使用父表格中如下属性,事件和..

jqGrid自定义查询

评论(0)浏览(1775)分类:jqGrid中文API
jqGrid自定义查询  为grid构造一个自定义查询表单,此方法使用jqGrid使用的url地址用于提交数据,提交查询后,键值对对象提交到服务器,这个数据被附加到postData参数中,仅提交输入过内容的字段。清空表单时,查询内容将会从postData中删除。提交服务器的数据,不是name,而是colModel中配置的index,当找不到index配置时才使用name,同时附加额外的数据 a _s..

jqGrid单字段查询

评论(0)浏览(2015)分类:jqGrid中文API
jqGrid单字段查询  单字段查询从服务器查询数据,一次只对一个字段进行查询。使用这个方法构造一个模态表单,用户可以选择一个字段用于查询。这个方法使用url提交数据,自定义和工具栏查询方法不一样。不同就是提交的数据不是键值对,参考下面数据如何提交安装要使用这个模块,你需要在下载页面勾选Common, Form Edit, filter插件,下载地址:http://www.trira..

jqGrid查询配置

评论(0)浏览(1148)分类:jqGrid中文API
jqGrid查询配置  jqGrid的列可以用于查询表单。表格查询按照规则从服务器加载数据。目前没有查询本地数据的模块当datatype设置为local。所有查询都是通过服务器(Currently we do not have module for searching on local data i.e when a datatype options is set to local. All the searching is done server side).有4中查询方法工具栏查询( toolbar se..

jqGrid高级查询

评论(0)浏览(2900)分类:jqGrid中文API
jqGrid高级查询  高级查询可以同时查询多个字段,使用不同的条件。单字段和高级查询使用相同的方法,但是配置和提交的数据不一样。安装要使用这个模块,你需要在下载页面勾选Common, Form Edit, filter插件,下载地址:http://www.trirand.com/blog/?page_id=6调用方式jQuery(#grid_id).searchGrid( {multipleSearch:true,...} );//新 APIjQuery(#grid_id).j..

JavaScript正则compile方法

评论(0)浏览(142)分类:JavaScript/Ajax开发技巧
JavaScript正则compile方法JavaScript正则compile定义和用法compile() 方法用于在脚本执行过程中编译正则表达式。compile() 方法也可用于改变和重新编译正则表达式。语法RegExpObject.compile(regexp,modifier)参数描述regexp正则表达式。modifier规定匹配的类型。g 用于全局匹配,i 用于区分大小写,gi 用于全局区分大小写的匹配。示例  在字符串中全局搜索 man,并用 ..

jqGrid显示和隐藏列

评论(1)浏览(5836)分类:jqGrid中文API
jqGrid显示和隐藏列注意,jqGrid4.0+版本不再将这个模块内置在jqGrid核心js文件里面,单独放到了一个js文件里面,要使用这个功能需要另外导入到页面中,获取更多信息查看升级信息:jqGrid 3.8.x 升级到 4.0.0相关更新描述显示一个模态窗口,用户可以选择需要显示和隐藏的列。插件开发者Piotr Roznicki安装  要使用格式化特性,需要在下载页面勾选Columns plugin后..

jqGrid 3.8.x 升级到 4.0.0相关更新

评论(0)浏览(583)分类:jqGrid中文API
jqGrid 3.8.x 升级到 4.0.0相关更新1.grid.postext.js 不再集成在jqGrid核心js文件里面  这个模块被移动到插件目录中独立出来,如果要使用这个功能需要手动导入到页面中。如果你想升级你的代码,修改作出如下的修改。(旧版本的jqGrid直接扩展了jQuery的对象方法,很容易和其他插件方法名称冲突,所以进行了改进,通过扩展jQuery的jqGrid方法来调用jqGrid内置的方法)旧方法替代..

jqGrid自定义格式化类型

评论(0)浏览(1506)分类:jqGrid中文API
jqGrid自定义格式化类型  可以对指定的列定义自定义格式化函数。注意配置这个值可以为函数名称,不能用引号括起或者以()结束,如格式化函数名称为func,不能配置formatter为func或者func(),直接func即可,可以直接配置一个匿名函数,示例jQuery(#grid_id).jqGrid({// ... colModel: [ // ... {name:'price', index:'price', width:60..

jquery文档处理方法append,html可以执行脚本

评论(0)浏览(617)分类:JavaScript/Ajax开发技巧
jquery文档处理方法append,html可以执行脚本  今天才发现原来jquery文档处理方法如append,html,before等方法可以执行内容中的script标签中的javascript脚本或者加载src指向的脚本文件,真是失败啊,用了那么久jquery...注意:text方法除外,text方法会将html标签中的替换为对应的实体对象  jquery源代码中部分文档处理方法如下 append: function() { return this.domManip..

jqGrid通用编辑规则

评论(0)浏览(6250)分类:jqGrid中文API
jqGrid通用编辑规则通用编辑属性  一个将数据显示在grid中主要的原因是为了快速容易的编辑它,jqGrid支持3种编辑方法jqGrid单元格编辑配置,事件及方法::编辑表格中的单元格jqGrid行编辑配置:同时编辑一行中的多个单元格jqGrid表单编辑配置:在grid外部的表单中编辑数据行安装在下载管理中每个模块有它自己的要求,但是不管哪个模块,都要勾选通用模块(common..

jqGrid自定义按钮

评论(0)浏览(3151)分类:jqGrid中文API
jqGrid自定义按钮jqGrid分页器自定义按钮自定义按钮可以执行自定义动作,被添加到分页器中。定义调用方式jQuery(#grid_id).navGrid(#pager,...).navButtonAdd(#pager,{parameters});新API调用方式jQuery(#grid_id).jqGrid('navGrid',#pager,...).jqGrid('navButtonAdd',#pager,{parameters});parameters 默认配置{ caption:NewButton, buttonico..

jqGrid分页pager配置

评论(0)浏览(17097)分类:jqGrid中文API
jqGrid分页pager配置jqGrid分页  jqGrid仅显示一些数据时,可以一次显示所有的数据而不用考虑使用分页获取数据。但是用处理大量数据的时候,你也许只想显示一次一部分数据,对此,你需要使用导航栏。使用TreeGrid时无法使用分页。定义  导航栏,也可以叫分页组件,html代码里面在table后放置一个div标签。注意是div,不是table,然后将div通过jqGrid的pager配置..

jqGrid导航Navigator配置

评论(0)浏览(8019)分类:jqGrid中文API
jqGrid导航Navigator配置  导航是一个用户界面,可以简单执行记录操作如查找或者编辑,用户可以执行表格操作通过点击对应的在导航栏上的图标按钮。  开发者可以创建自定义的动作,或者使用jqGrid已经定义的6个动作。jqGrid预定义的动作如下添加新记录编辑选择的行查看选择的记录删除选择的行查找记录重新加载grid这6个按钮在导航层的底部左边位置,如下图所示导航层..

jqGrid单元格编辑配置,事件及方法

评论(0)浏览(18710)分类:jqGrid中文API
jqGrid单元格编辑配置,事件及方法单元格编辑单元格编辑提供给用户修改一行中的单个单元格内容的功能,开发者可以通过ajax或者单元格编辑事件对修改的数据进行处理。通过下面的行为,单元格编辑支持键盘导航和执行单元格编辑操作点击一个不可编辑的单元格会选中它,然后可以通过上下左右键移动到其他单元格当移动到一个可编辑的单元格,可以按下Enter键将单元格切换到编辑模式。当..

jqGrid事件

评论(0)浏览(5433)分类:jqGrid中文API
jqGrid事件  jqGrid事件在配置jqGrid时作为属性传入,例如var lastSel;jQuery(#gridid).jqGrid({//... onSelectRow: function(id){ if(id id!==lastSel){ jQuery('#gridid').restoreRow(lastSel); lastSel=id; } jQuery('#gridid').editRow(id, true); },//...});  上面这个示例指定了当行..