Easy UI DataGrid 实战

$(function(){
			var lastIndex;
			var $dg = $("#tt");
			$dg.datagrid({
				title : '接口参数信息',
				idField : 'field_result',
				loadMsg : '数据正在加载,请稍后......',
				fitColumns : true,
				//singleSelect : true,
				columns : [ [
				{
					checkbox : true,
                    width : $(this).width()*0.2,
				},
				{
	                field : 'fieldname',
	                title : '名称',
	                width : $(this).width()*0.4,
	                editor : {type:'validatebox',
                               options:{required:true}
                        }
	            }, {
	                field : 'isrequired',
	                title : '是否必填',
	                width : $(this).width()*0.4,
	                editor : {type:'combobox',
                                  options{required:true,
                                         panelHeight:'auto',
                                         valueField:'isqid',
                                          textField:'isqname',
                                               data: [{isqid:'0',isqname:'否'},
                                                      {isqid:'1',isqname:'是'}
                                               ]
                                  }
                         }
	            }] ],
				toolbar:[{
					text:'添加',
					iconCls:'icon-add',
					handler:function(){
						$dg.datagrid('endEdit', lastIndex);
						$dg.datagrid('appendRow',{
							fieldname:'',
							isrequired:''
						});
						lastIndex = $dg.datagrid('getRows').length-1;
						$dg.datagrid('selectRow', lastIndex);
						$dg.datagrid('beginEdit', lastIndex);
                        //在新增一行函数加了"uncheckRow"这句以后,datagrid checkbox 默认不选中                       
                        $dg.datagrid('uncheckRow',lastIndex);
					}
				},'-',{
					text:'删除',
					iconCls:'icon-remove',
					handler:function(){
                        // 获取所有checkbox选中行
						var rows = $dg.datagrid('getChecked');
						for(var i=0; i<rows.length; i++){
							var row = rows[i];
                            var index = $dg.datagrid('getRowIndex', row);
							$dg.datagrid('deleteRow', index);
                        }
					}
				},'-',{
					text:'保存',
					iconCls:'icon-save',
					handler:function(){
						$dg.datagrid('acceptChanges');
						var inserted = $dg.datagrid('getRows');
                        // 全部校验过才保存
						var valid = $('#form').form('validate');  
	                    if(valid==true){
                            // 转换成json格式
	                    	$("#txtJsonField").val(JSON.stringify(inserted));
	                    }else{
	                    	$("#txtJsonField").val("");
	                    }
					}
				}],
				onBeforeLoad:function(){
					$dg.datagrid('rejectChanges');
				},
				onClickRow:function(rowIndex){
					if (lastIndex != rowIndex){
						$dg.datagrid('endEdit', lastIndex);
						$dg.datagrid('beginEdit', rowIndex);
					}
					lastIndex = rowIndex;
				}
			});
		});