extJS3.4 tabPanel刷新问题 成功20QB送上

[HuiZuoQiFenZui]

Ext.onReady(function() {
……
var ds_tab1 = new Ext.data.GroupingStore({
sortInfo:{field: 'oltip', direction: "ASC"},
storeId: 'myStore',
//autoDestrosy:true,
proxy : new Ext.data.HttpProxy({
url : 'res.do?method=tabOne'
}),
reader : new Ext.data.JsonReader({
root:'rows1'
},[
{name: "ponport1"},
{name: "onuid1"},
{name: "onuname1"},
{name: "onuip1"},
{name: "outype1"},
{name: "oltip"},
{name: "manu"},
{name: "model"},
{name: "mac"},
{name: "ponport2"},
{name: "onuid2"},
{name: "onuname2"},
{name: "onuip2"},
{name: "onuid2"},
{name: "outype2"},
{name: "flag"}]),
groupField: "flag"
});
var ds_tab2 = new Ext.data.GroupingStore({
sortInfo:{field: 'oltip', direction: "ASC"},
proxy : new Ext.data.HttpProxy({
url : 'res.do?method=tabTwo'
}),
reader : new Ext.data.JsonReader({
root:'rows2'
},[
{name: "mac1"},
{name: "onuip1"},
{name: "outype1"},
{name: "oltip"},
{name: "oltname"},
{name: "manu"},
{name: "model"},
{name: "ponport"},
{name: "onuid"},
{name: "mac2"},
{name: "onuip2"},
{name: "outype2"},
{name: "flag"}
]),
groupField: "flag"
});
})

[HuiZuoQiFenZui]

var cm_tab1 = new Ext.grid.ColumnModel({ columns: [ new Ext.grid.RowNumberer(), {header:"标记",dataIndex:'flag',width:200}, {header:"MAC地址", dataIndex:'mac',css:'background-color:A0B5FF;',width:200}, {header:"厂家", dataIndex:'manu',css:'background-color:A0B5FF;',width:200}, {header:"OLT型号", dataIndex:'model',css:'background-color:A0B5FF;',width:200}, {header:"OLT IP地址", dataIndex:'oltip',css:'background-color:A0B5FF;',width:200}, {header:"授权号", dataIndex:'onuid1',width:200}, {header:"*授权号", dataIndex:'onuid2',width:200}, {header:"ONUIP地址", dataIndex:'onuip1',width:200}, {header:"*ONUIP地址", dataIndex:'onuip2',width:200}, {header:"ONU名称", dataIndex:'onuname1',width:200}, {header:"*ONU名称", dataIndex:'onuname2',width:200}, {header:"ONU类型", dataIndex:'outype1',width:200}, {header:"*ONU类型", dataIndex:'outype2',width:200}, {header:"PON口", dataIndex:'ponport1',width:200}, {header:"PON口", dataIndex:'ponport2',width:200}, ], defaults: { sortable: true } }); var cm_tab2 = new Ext.grid.ColumnModel({ columns: [ new Ext.grid.RowNumberer(), {header:"MAC地址", dataIndex:"mac1"}, {header:"ONUIP地址", dataIndex:"onuip1"}, {header:"ONU类型", dataIndex:"outype1"}, {header:"OLT IP地址", dataIndex:"oltip",css:'background-color:A0B5FF;'}, {header:"OLT名称", dataIndex:"oltname",css:'background-color:A0B5FF;',width:140}, {header:"厂家", dataIndex:"manu",css:'background-color:A0B5FF;'}, {header:"OLT型号", dataIndex:"model",css:'background-color:A0B5FF;'}, {header:"PON口", dataIndex:"ponport",css:'background-color:A0B5FF;'}, {header:"授权号", dataIndex:"onuid",css:'background-color:A0B5FF;'}, {header:"*MAC地址", dataIndex:"mac2"}, {header:"*ONUIP地址", dataIndex:"onuip2"}, {header:"*ONU类型", dataIndex:"outype2"}, {header:"标记", dataIndex:"flag"} ], defaults: { sortable: true } });

[HuiZuoQiFenZui]

var view = new Ext.grid.GroupingView({ //forceFit: true, /*sortAscText : "正序", sortDescText: "倒序", columnsText : "列显示/隐藏", enableGroupingMenu : false,*/ groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "flag" : "flag"]})' }); var grid_tab1 = new Ext.grid.GridPanel({ id:"tab1", title:"PON EMS数据不合理", store : ds_tab1, colModel: cm_tab1, frame:true, collapsible: true, animCollapse: false, height:1200, stripeRows: true, loadMask: {msg: "正在加载数据，请稍侯..."}, view:view }); var grid_tab2 = new Ext.grid.GridPanel({ title:"资源数据不合理", //renderTo: Ext.getBody(), height : 400, width:1024, collapsible: true, animCollapse: false, store : ds_tab2, colModel: cm_tab2, border : false, // 去掉2px的内边框 columnLines: true, stripeRows: true, loadMask: {msg: "正在加载数据，请稍侯..."}, view:view });

[HuiZuoQiFenZui]

function dtlRes(oltIp){ //定义数据库借口的url ds_tab1.removeAll(true); ds_tab1.load({ params : { oltIp :oltIp } }); ds_tab2.removeAll(true); ds_tab2.load({ params : { oltIp :oltIp } }); ds_tab3.removeAll(); ds_tab3.load({ params : { oltIp :oltIp } }); ds_tab4.removeAll(); ds_tab4.load({ params : { oltIp :oltIp } }); ds_tab5.removeAll(); ds_tab5.load({ params : { oltIp :oltIp } }); //定义新的tab var win1 = Ext.getCmp("winDtlRes"); if (!win1) { var toolbar = new Ext.Toolbar({ items : [{ text : "下载", cls : "x-btn-text-icon", icon : "images/extjs/save.gif", handler : function(){ var rows = Ext.getCmp("gridQryRes").selModel.selections.items; var oltIp =rows[0].get("oltIp"); expTabRes(oltIp); }} ] }); var firstActive=true; var win1 = new Ext.Window({ id : "winDtlRes", title : "资源比对详情", iconCls: "icon-win", constrain : true, // win只能在视图中显示 closeAction:'hide', width:1024, height:500, frame:true, stripeRows: true, labelAlign : "right", tbar : toolbar, items : new Ext.TabPanel({ id:'tabpanel', 　　　　　　　　　　　activeTab:0,//当前标签为第1个tab（从0开始索引） 　　　　　　　　　　　border:false, 　　　　　　　　　　　items:[ grid_tab1, grid_tab2, grid_tab3, //grid_tab4, grid_tab5] 　　　　　　　　} ), 　　　　　plain:false }); } win1.show(); }

[y_keven]

沙发

[未知数]

代码好多,好混乱, 动态更新组件后需调用doLayout方法刷新视图 ds_tab5.doLayout();