案例说明

JEPaaS低代码平台ext.js与功能列表层级使用关系

页面层级说明

jemainview -> jecenterview -> jedataview 和 jeeditview
jedataview -> jegridview 和 jetreeview
jeeditview -> tabpanel -> jeformview

相关代码

获取列表相关层级


//获取当前功能整个列表界面
Ext.getCmp("JE_DEMO_PTLB_jemainview").up('[xtype=container]').up('[xtype=appfuncview]');

//根据层级获取列表
Ext.getCmp("JE_DEMO_PTLB_jemainview").down('[xtype=jecenterview]').down('[xtype=jedataview]').down('[xtype=container]').down('[xtype=jegridview]');

获取列表

var grid =Ext.getCmp("JE_DEMO_PTLB_jegridview");

获取列表按钮条

var  toolbar = Ext.getCmp("JE_DEMO_PTLB_jegridview").down("[xtype=toolbar]");

获取列表按钮

其他按钮同下方法,按钮编码不清楚在获取toolbar之后,找到items属性就可以找到

//获取列表左侧“+”按钮并隐藏
Ext.getCmp("JE_DEMO_PTLB_jegridview").down('toolbar[itemId=buttonBar]').down('button[itemId=leftgridadd]').hide();

//列表选中数据时,隐藏列表左侧“+”按钮并隐藏
Ext.getCmp("JE_DEMO_PTLB_jegridview").down("[xtype=toolbar]").down('button[itemId=leftgridadd]').hide();

//获取列表创建按钮并隐藏
Ext.getCmp("JE_DEMO_COURSE_jegridview").down('button[ref=gridInsertBtn]')
Ext.getCmp("JE_DEMO_PTLB_jegridview").down('toolbar[itemId=buttonBar]').down("button[ref=gridInsertBtn]").hide();

//  获取列表按钮并显示按钮
Ext.getCmp("JE_DEMO_PTLB_jegridview").down('toolbar[itemId=buttonBar]').down("button[ref=gridInsertBtn]").show();

// 多选情况下 获取按钮隐藏
Ext.getCmp("JE_DEMO_COURSE_jegridview").down('toolbar[itemId=buttonMultiBar]').down("button[itemId=gridEditBtn]").hide();

// 获取表单按钮,修改文本
Ext.getCmp("JE_DEMO_PTLB_jegridview").down('toolbar[itemId=buttonBar]').down("button[ref=gridInsertBtn]").setText("测试创建");

获取列表字段

//获取列表所有列头数组
Ext.getCmp("JE_DEMO_PTLB_jegridview").headerCt.items.items;

//利用下标获取某一字段
Ext.getCmp("JE_DEMO_PTLB_jegridview").headerCt.items.items[2];

//获取列表某个字段列,修改列头文本
Ext.getCmp("JE_DEMO_PTLB_jegridview").headerCt.items.items[2].setText
("测试文本");

获取列表子功能

列表内纵向展示

//获取列表所有子功能
Ext.getCmp("JE_DEMO_ZCBJE_jedataview").down("container[id=JE_DEMO_ZCBJE_childs_data_V]").items.items

//获取子功能
var childpanel = Ext.getCmp("JE_DEMO_ZCBJE_jedataview").down("container[id=JE_DEMO_ZCBJE_childs_data_V]").down("jemainview[id=TEST_jemainview]").down("jegridview");

var childpanel = Ext.getCmp("TEST_jedataview").down("jegridview");

//子功能编码直接获取
var child = Ext.getCmp("JE_DEMO_CP3_jemainview");

列表内横向展示


//子功能tab
Ext.getCmp("JE_DEMO_ZCBJE_jedataview").down("[xtype=tabpanel]")

Ext.getCmp("JE_DEMO_ZCBJE_jedataview").down("container[itemId=jedataview_center]").down("[xtype=tabpanel]")

//子功能显示的grid
Ext.getCmp("JE_DEMO_ZCBJE_jedataview").down("container[itemId=jedataview_center]").down("[xtype=tabpanel]").down("tab").card.down("jegridview");

通过事件(字段/按钮)获取列表层级和子功能

//通过渲染前/后事件获取当前功能列表层级
self.up("jemainview").down("jecenterview").down("jedataview").down("jegridview")
//通过渲染前/后事件获取当前主子功能列表层级
self.up("jemainview").down("jecenterview").down("jedataview").childPanel.items[0].items
//通过渲染前/后事件获取列头
self.up("jemainview").down("jecenterview").down("jedataview").down("jegridview").headerCt
//通过激活事件获取功能列表的过滤条件
self.getStore().proxy.extraParams.j_query
//通过按钮获取列表
btn.up("jegridview");
//通过按钮获取列表层级
btn.up("jegridview").up("jedataview").up("jecenterview").up("jemainview");
//通过按钮获取高级查询面板层级
btn.up("jegridview").up("jedataview").down('jeformview[type=query]')
//获取快速查询面板
btn.up("jemainview").down("[xtype=jetreeview]");
//通过按钮获取列表中某一字段列
btn.up("jegridview").headerCt.items.items[3];

关键字,相关问题

  • EXTJS
  • 列表
最后编辑: 呼丽华  文档更新时间: 2024-04-28 13:13   作者:呼丽华