【JQGRID DOCUMENTATION】.学习笔记.4.Navigator

Navigator是一个将查找或编辑记录的动作，变得非常容易达到用户交互特性。开发者可以创建自定义动作，也可以使用六个预定义的动作。jqGrid为预定义的动作提供icon button图形。

一组完整的预定义动作包括

1. 添加新行
2. 编辑选中行
3. 查看选中行
4. 删除选中行
5. 查找纪录
6. 重载grid

Navigator是一个jqGrid方法，它可以通过扩展grid主方法来激活和配置。内置的Navigator必须应用在pager元素上。另外，pager元素应该被定义。内置的Navigator动作相当于表单编辑动作，可以参考Form Editing。
有三种调用方法

1 $("#list").navGrid('#pager'); 2 $("#list").jqGrid("navGrid","#pager"); 3 或者链式调用 4 $("#list").jgGrid({.......}).navGrid("#pager")

• list是已经构建好的jgGrid的id
• pager是navigation bar的id
• parameters是一个设置数组，后面会定义
• prmEdit，prmAdd，prmDel，prmSearch，prmView是Form editing中指定动作的参数和事件对象

通过prmEdit….定义的每个特别的模块的id参数都会被传递，这是为了识别Navigator中的button的id。如果id没有定义，我们使用前缀和grid id的组合。如add按钮的id会是这样add_gridid。

Navigator上的文字定义在语言文件中。

参数列表

Property	Type	Description	Default
add	boolean	启用或禁用Navigator的add动作。当按钮被点击，一个带参数的editGridRow新方法被执行	true
addicon	string	为add动作设置icon。目前只有UI主题的图片可以被使用	ui-icon-plus
addtext	string	add按钮的文本	empty
addtitle	sting	当鼠标位于上方时显示的文本	Add new row
alertcap	string	当我们要编辑、删除或浏览行，却没有选择行时，出现的消息框的header	Warning
alerttext	string	当我们要编辑、删除或浏览行，却没有选择行时，出现的消息框的text	Please,select row
cloneToTop	boolean	将底部pager的所有动作克隆到顶部pager。注意，此时navGrid只能应用在顶部pager。顶部pager的id是grid id和”_toppager”的结合	false
closeOnEscape	boolean	指明用户是否能用ESC键关闭警告对话框	true
del	boolean	启用或禁用删除动作。当按钮被点击，delGridRow方法被执行
delicon	string	如果删除动作启用，设置它的icon。目前只能使用UI主题的图片。	ui-icon-trash
deltext	string	删除按钮上定义的文本	empty
deltitle	string	当鼠标位于按钮上方时显示的文本	Delete selected row
edit	boolean	启用或禁用导航的编辑动作。当按钮被点击时，当前选中的行作为editGridRow方法的参数被执行	true
editicon	string	如果编辑动作启用设置一个icon。注意目前只能使用UI主题的图片	ui-icon-pencil
editext	string	编辑按钮上的文本	empty
edittitle	string	当鼠标位于按钮上方时显示的文本	Edit select row
position	string	指明Navigator按钮在pager上的位置。可以是left,center,right	left
refresh	boolean	启用或禁用刷新按钮。当点击时，触发reloadGrid被执行，并且查询参数被清空	true
refreshicon	string	设置刷新动作的icon。注意	ui-icon-refresh
refreshtext	string	刷新按钮上的文本	empty
refreshtitle	string	鼠标位于按钮上方时显示的title	Reload Grid
refreshstate	string	指明grid怎样重载 firstpage重载第一页的数据 current重载应该保存当前页和当前节点	firstpage
afterRefresh	function	如果定义了，则在刷新按钮被点击后触发	null
beforeRefresh	function	如果定义了，则在刷新按钮被点击前触发	null
search	boolean	启用或禁用pager上的搜索按钮。当按钮点击时，searchGrid方法被执行	true
searchicon	string	设置搜索动作的icon。注意只能使用	ui-icon-search
searchtext	string	搜索按钮上的文本	empty
searchtitle	string	当鼠标在按钮上方时显示的title	Find records
view	boolean	启用或禁用浏览按钮。当按钮被点击时，viewGridRow方法被执行	false
viewicon	string	设置浏览动作的icon，注意只能	ui-icon-document
viewtext	string	设置浏览按钮的文本	empty
viewtitle	string	当鼠标在按钮上方时显示的title	View selected row
addfunc	function	如果定义了，则替代内置add函数。这个函数没有参数	null
editfunc	function	如果定义了，则替代内置edit函数。被编辑行的id会作为参数传递给函数	null
delfunc	function	如果定义了，则替代内置del函数。被编辑航的id会作为参数传递给函数	null

1 < script > 2 ... 3 jQuery( " #grid_id " ).jqGrid({ 4 ... 5 pager : ' #gridpager ' , 6 ... 7 }).navGrid( ' #gridpager ' ,{view: true , del: false }, 8 {}, // 使用eidt的默认设置 9 {}, // 使用add的默认设置 10 {}, // delete instead that del:false we need this 11 {multipleSearch : true }, // 启用改进版的搜索 12 {closeOnEscape: true } /* 允许使用ESC键关闭视图对话框 */ 13 ); 14 ... 15 </ script >