Extjs 4.2 Grid增删改及后台交互(Java)
上次发了Easyui Datagrid的增删改查的使用学习记录后一直想整理下基于Extjs4.2的Grid学习使用记录。苦于抽不出时间,一直拖到现在。不得不说,Extjs确实很强大,新版的Neptune风格也很入我眼,但毕竟没怎么用过,第一次用,也不敢上来就搞什么自定义组件,也就纯粹的model+store+panel声明式创建表格了。
抛开分页,抛开排序,今天只简单讲一下最近使用中总结出来的rest形式增删改查数据的方式。发现这种方式挺不错的,故而分享下。
代码Example如下:
定义Model
Ext.define('Person', { extend: 'Ext.data.Model', fields: [{name: 'id', type: 'int', useNull: true }, 'email', 'first', 'last'], validations: [{ type: 'length', field: 'email', min: 1 }, {type: 'length', field: 'first', min: 1 }, {type: 'length', field: 'last', min: 1 }] });
Easyui Datagrid增删改及后台交互(java)
最近项目的特殊性可算是把我折腾得够呛,从最开始的整站JS,到现在的Liferay,且不说后台,单单前台框架就让我从Dojo到YUI又到AUI、jQuery、ExtJS,常用API翻了一遍,常见问题解决了一遍,而归根结底,为的就是一个方便好用、加载迅速的Grid控件。还好目前是定准用ExtJS了,不然常用控件都用一遍也没找到完全合适的,就困难了。题外话至此,下面开始正题。
刚刚看到同学在之前发的文章,在使用Easyui DataGrid时遇到新增行数据在保存时不能获取的问题,解决方法是在保存时先执行$('#example′).datagrid('acceptChanges');然后前台获取全部行,再拼装字符串传到后台,这样做是可以解决,但实际上Easyui Datagrid似乎有更好的API供调用。为了和我一样的新手少走弯路,故写此篇文章以便参考。 查看更多...