您的位置:首页 > 编程语言 > PHP开发

tpl渲染表格以后刷新表格数据

2014-08-21 22:55 134 查看
这里不对template做介绍,可以参见官方网站:

http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.Templatehttp://docs.sencha.com/extjs/4.2.2/#!/api/Ext.XTemplate

我们定义一个模板包含表格相关信息,然后把表格放在一个Component组件里面,用apply写入组件的html属性,打开窗口渲染表单并加载数据以后即可看到结果

var tpl = new Ext.Template(".....省略表格相关的dom......");

var jasonData = {....省略json 数据....};


fillPropertyTable=Ext.create('Ext.Component', {
    html : tpl.apply(jasonData)
});

这有个问题就是,当我们刷新jasonData的数据后,页面内的表格数据没有刷新,这是因为数据是在表单所在控件渲染后加载的,再次刷新数据的时候控件不再渲染了。因此需要重写数据到控件里面并且重新渲染控件,如下:
tableComponent.on('render', function() {

    tpl.overwrite(tableComponent.body, jsonData);
    tableComponent.doComponentLayout();
});
if(Window!=undefined){//如果控件已经渲染完成
    tpl.overwrite(tableComponent.body, jsonData);
    tableComponent.doComponentLayout();
}
Window是窗口,tpl定义表单模板,tableComponent是模板所在的控件,jsonData定义了表单需要的json数据,第一次打开Window,在渲染的时候把数据加载进去,当刷新数据后需要再次重写数据并渲染组件。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  extjs