1、ExtJS布局之border实例ExtJS布局之border实例border布局是常见的布局样式,下面是一个实际项目的示例,比较简单,仅供初学者参考。前两天遇到一个border布局的界面问题,如下:west是一个tree a,center是一个tree b和一个Panel,如下图界面要求:点击左边树节点【培训项目】,打开右边的界面:包括一个树和一个panel。功能要求:点击右边树的节点,班型列表会根据树节点的ID进行查询,并显示相应的查询结果。问题:整个界面的右半部分怎样布局?解决:左边的tree就不用解释了,是哪里都能找到的样式。这里主要解释下右半部分的布局:通常情况下,点击树节点,在布局的
2、某个部分(常见的是center位置)打开一个界面的常用方式是:Js代码 1. contentEl:center1, 2. html:contentEl : center1,html : 但这种方式不能在目前场景下使用,因为panel要能获得从tree b传递过来的参数,所以上面这种方式是不行的:classTypeNew.jsp无法获得tree b的节点ID。建议采用如下方式:1.整体采用border布局。tree a位于west,tree b和Panel位于center。2.tree b和Panel采用border布局。tree b位于west,Panel位于center。示例代码:Js代码
3、1. /* 2. *班型管理部分 3. */4. var_JwSales=newExt.Panel( 5. region:center, 6. collapsible:true, 7. items:_gridStudyClassType,_panelStudyClassTypeInf,_panelStudyClassTypeNodes, 8. 9. listeners: 10. show:function() 11. 12. _panelStudyClassTypeInf.getForm().reset(); 13. 14. _sessionStore.load(); 15. 16. var_
4、record=_sessionStore.getAt(0); 17. 18. Ext.getCmp(iStudyClassTypeOprUserName).setValue(_record.get(userName); 19. Ext.getCmp(iStudyClassTypeOprUserId).setValue(_record.get(userId); 20. 21. , 22. 23. buttons: 24. 25. text:保存, 26. 27. listeners: 28. click:function() 29. 30. varstId=Ext.getCmp(iStudyCl
5、assTypeStId).getValue(); 31. 32. if(_panelStudyClassTypeInf.getForm().isValid() 33. 34. vararrayInfKey=getArrayStudyClassTypeKey(); 35. 36. vararrayInfValue=getArrayStudyClassTypeValue(); 37. 38. vararrayNodesKey=getStudyTypeNodesKey(); 39. 40. vararrayNodesValue=getStudyTypeNodesValue(); 41. 42. if
6、(stId=) 43. 44. /添加 45. 46. MSClassType.isDo4Add(Ext.getCmp(iItemCombo).getValue(), 47. stName, 48. Ext.getCmp(iStudyClassTypeStName).getValue(), 49. functionaddRtn(rtn) 50. 51. if(rtn=true) 52. 53. MSClassType.createEntity( 54. arrayInfKey,arrayInfValue, 55. arrayNodesKey,arrayNodesValue, 56. 57. f
7、unctioncreateEntityRtn(rtnCreate) 58. 59. if(rtnCreate=success) 60. 61. Ext.MessageBox.alert(信息提示,添加成功,点击返回!); 62. 63. _storeStudyClassType.load(params:start:0,limit:6); 64. 65. Ext.MessageBox.alert(信息提示,添加成功,点击返回!); 66. 67. addHandler(); 68. 69. else70. 71. Ext.MessageBox.alert(信息提示,添加失败,请与系统管理员联系!); 72. 73.
copyright@ 2008-2022 冰豆网网站版权所有
经营许可证编号:鄂ICP备2022015515号-1