• Ext.data.Record 的基本法及其 API 帮助的一个 Bug

    calendar Jul 23, 2009   ---   · 2 min read · javascript ExtJs  ·
    Share on: linkedin copy
    基本用法(不涉及其他相关类)：

    Ext.data.Record 实例就是对应一条记录，记录通常会放在数据集 Store 中，其中包含了数据的定义信息(字段名等) 和数据的值信息。这里不涉及与它相关的 Proxy、DataReader 和 Store，只单纯的用 Record 的方法。通常是两步，先调用 Record 的 create() 方法，返回一个类，然而 new 前面方法返回的类，代码过程如下：
     1//第一步，create() 返回一个 Record 的子类(定义了数据表现，有点像泛型)
 2var Person = Ext.data.Record.create([ //用对象数组指定每个字段名
 3	{name:'name'},{name:'email'} //name 属性指定每个字段名
 4]);
 5
 6//通过前面 create() 返回的 Person 类创建 record 实例
 7var record = new Person({//传入一个对象作为第一个参数，注意属性名对应
 8	name:'Unmi',
 9	email:'fantasia@sina.com'
10},2009); //第二个参数指定记录的标识 ID，未指定 ID 则为你用整数进行编号
11
12//验证效果，只取 id 和其中的 email 属性，可试下前面无 {id:'name'}的情况
13alert('id:' + record.id +", email:" + record.get('email'));
    代码说明： Read More

  • ExtJs 中使用 TaskRunner 和 DelayedTask 如何传参数到 run() 方法

    calendar Jul 21, 2009   ---   · 2 min read · javascript ExtJs  ·
    Share on: linkedin copy
    在 ExtJs 中支持多线程的类有 Ext.util.TaskRunner 和 Ext.util.DelayedTask。TaskRunner 提供了多线程的定时服务，DelayedTask 允许你延时多久在新建线程中执行一个任务。Ext.TaskMgr 是一个 TaskRunner 实例，在 TaskMgr.js 源码中可以看到最后一行是：


    Ext.TaskMgr = new Ext.util.TaskRunner();

    实质上不管是 TaskRunner 还是 DelayedTask，它们都是通过 setInterval() 来执行任务的，TaskRunner 能多次重复的执行一个方法，而 DelayedTask 是延时执行完一次任务后就会调用 clearInterval() 来保证只执行一次。所以这里所说如何向任务的 run() 方法传递参数，本质上就是向 setInterval() 中方法传递参数。 Read More

  • ExtJs 中 xtype 与组件类的对应表

    calendar Jul 16, 2009   ---   · 4 min read · javascript ExtJs xtype  ·
    Share on: linkedin copy
    我们在使用 ExtJs 创建组件时最容易理解的当然是用
     
    new Ext.form.TextField({fieldLabel:'姓名', id:'name',width:120})；

    我们还可以直接用 xtype(比如 TextField 对应的 xtype 是 textfield) 的对象形式来创建组件，比如在面板的 items 属性中，尤其是多个组件或需要写许多的 ExtJs 相关代码时就更值得推荐。我们来对照如下形式就知道了：
     1items[
 2    new Ext.form.TextField({fieldLabel:'姓名', id:'name', width:120}),
 3	new Ext.form.TextField({fieldLabel:'密码', id:'passwd', inputType:'password', width:120}),
 4	new Ext.form.DateField({fieldLabel:'生日', id:'birth', format:'Y年m月d日', width:120})
 5]
 6//替换成用 xtype 写法就如下(似乎只是免去了很多的 new ...)
 7items[
 8    {xtype:'textfield', fieldLabel:'姓名', id:'name', width:120},
 9	{xtype:'textfield', fieldLabel:'密码', id:'passwd', inputType:'password', width:120},
10	{xtype:'datefield', fieldLabel:'生日', id:'birth', format:'Y年m月d日', width:120}
11]
    Read More

  • 创建兼容 IE/FireFox 的 insertAdjacentHTML 方法

    calendar Jul 8, 2009   ---   · 2 min read · javascript ExtJs  ·
    Share on: linkedin copy
    在 IE 中我们可以用 insertAdjacentHTML 往元素的 beforeBegin,beforeEnd,afterBegin,afterEnd 处理插入新元素。而在非 IE 中没有该方法，因而我们要创造一个兼容的 insertHtml 方法来。

    本方法从 Ext 2 中剥离出来的，在 ext-all-debug.js 中有以下方法：

    Ext.DomHelper.insertHtml( String where, HTMLElement el, String html ) : HTMLElement

    参数介绍：

    where：插入位置。包括beforeBegin,beforeEnd,afterBegin,afterEnd。
    el：用于参照插入位置的html元素对象
    html：要插入的html代码 Read More