首页 > 代码库 > ExtJs4常用配置方法备忘

ExtJs4常用配置方法备忘

viewport布局常用属性

 

            new Ext.Viewport({                layout: "border",                renderTo: Ext.getBody(),                defaults: {                    bodyStyle: "background-color: #FFFFFF;",                    frame: true                },                //split为true,即可达到上下左右拉伸效果                //layout:fit,填满布局                //collapsible:true,north模块被收缩到最上面                items: [{ region: "north", height: "60%", collapsible: true, split: true, layout: "fit", border: true, items: [ClassTreeGrid] },                        { region: "center", autoScroll: true, split: true, border: true, layout: "fit", items: [RecGrid] }                ]            });

Ext.window.Window拉伸属性,以及textareafield,form的可拉伸属性

提醒:resizable: true, //是否可以拉伸,同时也适用于textareafield,form等

 var AddDialog = Ext.create("Ext.window.Window", {                layout: "fit",                iconCls: ‘a_add‘,                closeAction: ‘hide‘,        //窗口关闭的方式:hide/close                resizable: true,            //是否可以拉伸                closable: true,            //是否可以关闭                modal: true,                //是否为模态窗口                items: AddForm,                buttons: [{                    text: ‘添加‘,                    iconCls: ‘a_add‘,                    id: "btnAdd",                    handler: Add                },                {                    id: "btnCancel",                    iconCls: ‘a_cross‘,                    text: ‘重置‘,                    handler: function () {                        AddForm.form.reset();                    }                }]            });

为空默认值,验证配置,及验证方法,column布局

 var AddForm = Ext.create("Ext.form.Panel", {                border: false,                fieldDefaults: {                    msgTarget: ‘side‘,  //提示信息在右旁边显示图标                    labelWidth: 70,                    align: "right",                    allowBlank: false //不与许为空                },                width: 380,                defaults: {                    padding: 10,                },                layout: ‘column‘,                items: [                     {                         xtype: "hidden",                         name: ‘quId‘,                     },                      {                          xtype: "numberfield",                          fieldLabel: ‘第几题‘,                          name: ‘sorts‘,                          regex: /^\d+$/,  //正则验证                          maxLength: 100,                          columnWidth: 1,                      },                    {                        xtype: "combo",                        fieldLabel: ‘皮肤分类‘,                        name: ‘claId‘,                        id: ‘claId‘,                        valueField: ‘qcId‘,                        displayField: ‘claName‘,                        columnWidth: 1,   //列布局站的比例,总共为1,多分为0.5+0.5 ....和为1                         allowBlank: false,                        store: QuestionClassStore,                        emptyText: "请选择皮肤分类", //为空输入框暗灰提示                        blankText: "请选择皮肤分类111", //错误提示                    },                     {                         xtype: "filefield",                         fieldLabel: ‘上传图片‘,                         buttonText: ‘  浏 览  ‘,                         regex: /^.+\.((jpg)|(gif)|(gif)|(png)|(jpeg)|(bmp))$/, //正则验证                         name: ‘queImg‘,                         allowBlank: true, //不允许为空                         columnWidth: 1                     },                     {                         xtype: "textareafield",                         grow: true,                         fieldLabel: ‘问题‘,                         name: ‘question‘,                         columnWidth: 1                     }                ]            });            //添加问题            function Add() {                var form = AddForm.getForm();  //获取表单form                if (form.isValid()) {   //验证表单                    form.submit({                        url: "/question/Add",                        params: { json: Ext.JSON.encode(AddForm.form.getValues()) },                        waitMsg: ‘正在上传请稍候...‘,                        success: function (form, action) {                            Ext.Msg.alert("提示", action.result.msg);                            QuestionGridStore.load();                        },                    })                }            }

给img的路径src赋值

               itemclick: function () {                        var rows = ShopPaperGrid.getView().getSelectionModel().getSelection();                        if (typeof (rows[0]) != "undefined") {                            Ext.getCmp("imgForm").getEl().dom.src = http://www.mamicode.com/rows[0].data.imgPath;   //给src赋值                        }                        else {                            Ext.getCmp("imgForm").getEl().dom.src = "http://www.mamicode.com/images/default.jpg";                        }                    }

ext.msg.confrim()

   Ext.Msg.confirm("提示", "确定删除", function (btn) {                //btn=yes或者no                if (btn == "yes") {                    alert("删除成功");                }                else {                    alert("取消啦删除");                }            });

先写这么多,现在想不起来啦,想起来再加上,做为备忘博客