在表单初始化时添加自定义代码

在表单初始化时，若要添加自定义代码，在initComponent中实现，比如，我想实现点击button控件，为文本框赋值的功能：

initComponent: function(){
        var me = this;  
        me.callParent(arguments);
        me.$$$button1.on({
            click: function(){
                me.$$$text1.setValue('点击按钮为文本赋值');
                     }
           });
 }

效果

运行查看效果：

如何访问控件

在initComponent中实现，自定义代码功能时，如何访问控件呢?比如：我希望点击按钮后，给主表字段和明细表第一行字段分别赋值：

访问主表控件：me.$$$控件

访问子表：me.$$$grid1

访问子表控件：me.viewmodel.rootRow.tables['子表1'].rows[行号]

代码

    initComponent: function(){
        var me = this;
        me.callParent();
        
        me.$$$button1.on({
            click: function(){
                  me.$$$text1.setValue('日常');
                  me.viewmodel.rootRow.tables['子表1'].rows[0].set('物品名称','111');
                  me.viewmodel.rootRow.tables['子表1'].rows[0].set('数量','10');
            }
        });
    }

效果

运行查看效果：

使用debugger

当我们使用自定义代码扩展表单时，想知道如访问控件的语法等问题时，可借助debugger来查看，如图：

监听控件事件

在控件上监听

在控件上监听事件，一般使用listeners。

 "listeners": {
               //监听控件事件事件
       }

在initComponent中监听

也可以在initComponent监听，更方便查找和维护。

     initComponent: function(){
        var me = this;  
        me.callParent(arguments);

        me.$$$text1.on({
            change: function(){
                alert("aaa");
            }
        }),
            
        me.$$$button1.on({
             click: function(){
                alert("bbb");
            }
        });
    }

设置控件属性

控件的属性有很多，默认显示了常用的几种。若需要设置控件的其他属性，切换到源码，找到对应的控件直接设置即可：

使用第三方控件

在$items中引用第三方控件，如图：引用一个图表控件。

效果图：

制作企业控件

跨域Ajax调用