JQGrid学习之自定义按钮

用法： 

Java代码 

1. <script>   
2. ...   
3. jQuery("#grid_id").navGrid("#pager",...).navButtonAdd("#pager",{parameters});   
4. ...   
5. </script>  

如果使用新API 

Java代码 

1. <script>   
2. ...   
3. jQuery("#grid_id").jqGrid('navGrid',"#pager",...).jqGrid('navButtonAdd',"#pager",{parameters});   
4. ...   
5. </script>  

默认参数 

Java代码 

1. { caption:"NewButton", buttonicon:"ui-icon-newwin", onClickButton:null, position: "last", title:"", cursor: "pointer"}  

caption：按钮名称，可以为空，string类型 
buttonicon：按钮的图标，string类型，必须为UI theme图标 
onClickButton：按钮事件，function类型，默认null 
position：first或者last，按钮位置 
title：string类型，按钮的提示信息 
cursor：string类型，光标类型，默认为pointer 
id：string类型，按钮id 

如果设置多个按钮： 

Java代码 

1. ...   
2. jQuery("#grid_id")   
3. .navGrid('#pager',{edit:false,add:false,del:false,search:false})   
4. .navButtonAdd('#pager',{   
5.    caption:"Add",    
6.    buttonicon:"ui-icon-add",    
7.    onClickButton: function(){    
8.      alert("Adding Row");   
9.    },    
10.    position:"last"  
11. })   
12. .navButtonAdd('#pager',{   
13.    caption:"Del",    
14.    buttonicon:"ui-icon-del",    
15.    onClickButton: function(){    
16.       alert("Deleting Row");   
17.    },    
18.    position:"last"  
19. });   
20. ...  

按钮间的分隔 

Java代码 

1. <script>   
2. ...   
3. jQuery("#grid_id").navGrid("#pager",...).navButtonAdd("#pager",{parameters}).navSeparatorAdd("#pager",{separator_parameters}};   
4. ...   
5. </script>  

默认参数： 

Java代码 

1. {sepclass : “ui-separator”,sepcontent: ''}   

sepclass：ui-jqgrid的属性名 
sepcontent：分隔符的内容