2013年05月 归档

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供调用。为了和我一样的新手少走弯路,故写此篇文章以便参考。 查看更多...