首页 > 编程知识 正文

extjs模板循环的简单介绍

时间:2023-12-22 11:30:27 阅读:318913 作者:TCSF

本文目录一览:

如何销毁extjs窗体?

配置closeAction: 'close' 属性

API中这样讲:

closeAction : String

当关闭按钮被点击时执行的操作。 默认的操作是'close',这将把窗口从DOM中移除...

当关闭按钮被点击时执行的操作。 默认的操作是'close',这将把窗口从DOM中移除并摧毁它。 另一个合法的选项是'hide',这将简单地隐藏窗口,通过 设置它的visibility为hidden,并且设置一个负数偏移量。 通过 show 方法可以让窗口重新显示。

1、触发 beforedestroy  

这是一个可取消的事件,如果需要,可能通过提供事件代理来阻止组件被销毁。 

2、调用 beforeDestroy 方法 

又一个模板方法,在子类中可以重新实现和调用父类的方法。 

3、移除事件监听者(代理)

如果组件已被呈现,则移除它底层的 HTML 元素的事件监听列表,然后将元素从 DOM中移除。

4、onDestroy 被调用

这个还是一个模板方法,在子类可以重新实现。这里需要注意的是,容器类提供了一个默认的 onDestroy 实现,它会循环销毁它的成员组。

5、组件实例从 ComponentMgr 中反注册

不可以再通过 Ext.getCmp 获取到对象实例。

6、destroy 事件被触发

这只是一个简单的提醒,表示组件销毁成功。

7、移除 Component 上的事件代理

组件可以独立于元素,自己拥有事件代理,如果存在则移除它们。

extjs的card布局中使用XTemplate模板填充item的问题

本质原因是变量_pageFile是在render事件触发后,才调用事件函数然后去获取这个参数,而这个参数最后的结果是数据的最后一个值,修改代码如下:

//..

listeners : {

                'render' : function(panel){

                    console.log(this);

                    this.tpl.overwrite(this.body, this.initialConfig.pageFile);

                }

            },

            scope : this,

            pageFile : _pageFile

//..

完整的例子:

var curIndex = 1;

    var navHandler = function(){

         if(curIndex == 2) {

         curIndex  = 0

        }

   card.getLayout().setActiveItem(curIndex);

    curIndex ++;

    

};

    var card = new Ext.Panel({

    title: '向导的演示 Example Wizard',

    layout:'card',

    activeItem: 0,

    bodyStyle: 'padding:15px',

    defaults: {

       // 每个子组件都有效 applied to each contained panel

        border:false

    },

    // 简单的导航按钮,可以扩展更多 just an example of one possible navigation scheme, using buttons

    bbar: [

        {

            id: 'move-prev',

            text: '后退',

            text: 'Back',

            handler: navHandler.createDelegate(this, [-1]),

            disabled: true

        },

        '-',

        {

            id: 'move-next',

            text: '前进 Next',

            handler: navHandler.createDelegate(this, [1])

        }

    ],

    // 内面的面板,就是“卡片” the panels (or "cards") within the layout

    items: []

});

    var dataFile = [

            {

                pageFile : [

                    {

                        spec : 1,

                        pic : 11,

                        ranged : 111

                    }

                ]

            },

            {

                pageFile : [

                    {

                        spec : 2,

                        pic : 22,

                        ranged : 222

                    }

                ]

            }

    ];

    var _pageFile;

    for (var i = 0; i dataFile.length; i++) {

        _pageFile = dataFile[i];

        //_pageFile =

        card.add({

            id: 'card-' + (i + 1),

            tpl : new Ext.XTemplate(

                'table border="1"',

                'trtd规格/tdtd图片/tdtd对白/td/tr',

                'tpl for="pageFile"',

                'trtd{spec}/tdtd{pic}-{ranged}/tdtd{dialogue}-{ranged}/td/tr',

                '/tpl',

                '/table'

            ),

            listeners : {

                'render' : function(panel){

                    console.log(this);

                    this.tpl.overwrite(this.body, this.initialConfig.pageFile);

                }

            },

            scope : this,

            pageFile : _pageFile

        });

    }

    card.render(document.body)

Extjs如何动态加载Extjs脚本

1、首先,需要先创建一个基本可用的 ExtJS 模板, 这个很简单, 如下所示:

!DOCTYPE html

html

head

title/title

link rel="stylesheet" type="text/css" href="" /

script type="text/javascript" src=""/script

/head

body

/body

/html

2、需要引用的脚本是 ExtJS 根目录下的 ext-debug.js , 不是 ext-all-debug.js, 这个文件非常小, 只有几百K , 当让这个只是最基本的 ExtJS 组件, 不包括任何的界面功能。

3、配置 Ext.Loader 启用动态加载;

4、ExtJS 中的动态加载是由 Ext.Loader 来完成的, 默认不启用动态加载, 所以接下来需要做的事配置 Ext.Loader 启用动态加载, 在上面模板的 body 标签内添加如下代码:

script type="text/javascript"

Ext.onReady(function() {

Ext.Loader.setConfig({

enabled : true,

disableCaching: false,

paths : {

Ext : '/ext-4/src'

}

});

});

/script

注意:上面的代码启用了动态加载, 禁用了浏览器缓存, 以及指定了 ExtJS 的所部署的路径。

extJS4.0 我在for循环里执行submit 为什么循环完了以后才会执行? 不能循环一次执行一次.

这样是不行的,submit提交是需要时间的返回,for循环不会等他的。不然如果提交的页面一直没返回结果,程序岂不是就卡住在这边了。

extjs里的Ext.each可以中途退出吗?

Ext.each(

function(value)

{

if(value == '2'){

return false

}

},this);

each方法是遍历循环,你需要加一个自定义方法

这个方法每个元素都会执行一遍

你可以在方法中添加一个判断语句,

当返回false的时候终止跳出遍历循环

Extjs 2.0 如何动态的添加checkBox

两种办法:

1:

从后台查出的权限,拼成字符串

,“,”分开,request.setArribute(‘')那个字符串

在前台拿到

用变量接受,将之转化成数组

循环数组,每次循环的时候,创建一个checkBox,ok

了,其实应该用checkboxgroup

这样只要创建boxlabel

就行了

以上做法

不好的地方是

只能在jsp中取得request中的属性,不能再js中即时的拿到

2:创建一个checkbox

里面的属性就是你checkbox想要设置的属性,然后从后台查出的权限,每个权限new出一个checkbox类,这样就得到一个checkbox的list

将之转化为json串

写到前台,前台接受并且解析出一个数组,循环数组,如的到得数组

powers

for(var

i=0;ipowers.length;i++){

Ext.getCmp('form').add(powers[i]);

}

就可以了

不知楼主懂没懂。。。。

加上布啊局的话就自己想办法了,将上面的例子简单修改皆可以

当然也可以不创建类,直接把权限拼成一个字符串,然后再前台接受并解析,转化成数组

循环数组

for(var

i=0;ipowers.length;i++){

Ext.getCmp('form').add(new

Ext.Checkbox({}));

}

Checkbox里面的设置

就不用我所了吧

我这里没有代码

忘记了Ext.Checkbox有没有了

反正是这个意思,勿要吹毛求疵

,希望对你有帮助

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。