easyUI datagrid实例

JavaScript部分
$(function() {datagrid = $('#datagrid').datagrid({url : '请求路径',toolbar : '#toolbar',//工具条singleSelect : false,//是否是单选  false是多选sortName : 'id',//默认根据什么排序sortOrder : 'asc',//升序iconCls : 'icon-save',//显示的图标remoteSort : true,//远程获取数据pagination : true,//显示分页条pageSize : 10,//每页条数pageList : [ 10, 20, 30, 40, 50, 60, 70, 80, 90, 100 ],fit : true,//充满表格fitColumns : true,//列自动充满nowrap : false,//是否不换行border : false,//是否显示边框idField : 'id',//主键frozenColumns : [ [ {title : 'id',//列头field : 'id',//对应的字段width : 50,//宽度checkbox : true}, {field : 'name',title : '材料名称',width : 100,sortable : true} ] ],columns : [ [ {field : 'descri',title : '材料描述',width : 200,sortable : false}, {field : 'addDate',title : '添加时间',width : 100,sortable : false} ] ],//右击菜单onRowContextMenu : function(e, rowIndex, rowData) {e.preventDefault();$(this).datagrid('unselectAll');$(this).datagrid('selectRow', rowIndex);$('#menu').menu('show', {left : e.pageX,top : e.pageY});}});});function append() {/*visamaterialDialog.dialog({ href:'visamaterial-save.action' });*/visamaterialDialog.dialog('open');visamaterialForm.form('clear');}function edit() {var rows = datagrid.datagrid('getSelections');if (rows.length != 1 && rows.length != 0) {var names = [];for ( var i = 0; i < rows.length; i++) {names.push(rows[i].name);}$.messager.show({msg : '只能择一项进行编辑！您已经选择了【' + names.join(',') + '】' + rows.length+ '个材料',title : '提示'});} else if (rows.length == 1) {visamaterialDialog.dialog('open');visamaterialForm.form('clear');visamaterialForm.form('load', {id : rows[0].id,name : rows[0].name,mount : rows[0].mount,filename : rows[0].fileName,descri : rows[0].descri});/*$.ajax( { url : "visamaterial!toUpdate.action", data:"id="+rows[0].id, success : function(r) { console.info(r); visamaterialDialog.dialog( { width : 500, height : 300, href : 'visamaterial-update.action' }); visamaterialDialog.dialog('open'); } });*/}}function remove() {var id = [];var rows = datagrid.datagrid('getSelections');if (rows.length > 0) {$.messager.confirm('请确认', '您要删除当前所选材料？', function(r) {if (r) {for ( var i = 0; i < rows.length; i++) {id.push(rows[i].id);}$.ajax({url : 'visamaterial!deleteBatch.action',data : {ids : id.join(',')},cache : false,dataType : "json",success : function(response) {datagrid.datagrid('unselectAll');datagrid.datagrid('load');$.messager.show({title : '提示',msg : '删除成功！'});}});}});} else {$.messager.alert('提示', '请选择要删除的记录！', 'error');}}</script>



HTML部分

<div region="center"><div id="toolbar" class="datagrid-toolbar" style="height: auto; display: none;"><a class="easyui-linkbutton" iconCls="icon-add" onclick="append();"plain="true" href="javascript:void(0);">增加</a> <aclass="easyui-linkbutton" iconCls="icon-edit" onclick="edit();"plain="true" href="javascript:void(0);">编辑</a> <aclass="easyui-linkbutton" iconCls="icon-remove" onclick="remove();"plain="true" href="javascript:void(0);">删除</a> <aclass="easyui-linkbutton" iconCls="icon-reload"onclick="datagrid.datagrid('reload');" plain="true"href="javascript:void(0);">刷新</a></div><table id="datagrid"></table></div>

                                             
        0        0           
	
				
	
					   
easyUI datagrid实例
	  	   
easyui-datagrid实例
	  	   
第六讲 easyUI datagrid实例
	  	   
easyui datagrid json分页实例
	  	   
easyui datagrid属性动态设置实例
	  	   
Easyui-Datagrid实例-----动态加载数据生成Datagrid
	  	   
easyui datagrid
	  	   
easyui-datagrid
	  	   
easyUI DataGrid
	  	   
Easyui datagrid
	  	   
EasyUI datagrid
	  	   
easyUI--datagrid
	  	   
easyui datagrid
	  	   
easyui   datagrid
	  	   
easyui datagrid
	  	   
easyui datagrid
	  	   
easyui.datagrid
	  	   
easyUI  datagrid
	     		  
	  	   
LeetCode257:Binary Tree Paths
	  	   
冒泡排序之Java实现
	  	   
【SSH进阶之路】【二】Hibernate搭建开发环境+简单实例
	  	   
ElasticSearch5.0——_all字段
	  	   
javaEE+大数据-Hadoop平台如何优化
	  	   
easyUI datagrid实例
	  	   
python技巧之下划线（二）
	  	   
Android中获取应用信息
	  	   
记录一下，自定义控件
	  	   
「jQuery知识」jQuery之知识体系汇总
	  	   
安装APK时引发INSTALL_PARSE_FAILED_MANIFEST_MALFORMED错误的几种可能(申明：来源于网络)
	  	   
队列（裸题）
	  	   
Java在线学习,Java学习地址
	  	   
selenium java