`
禹爸爸
  • 浏览: 79076 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

FomPanel加到TabPanel中按钮点击失效问题之解决方法

Ext 
阅读更多

昨天晚上在家里写代码时遇到一个奇怪的问题。事先写好了一个FormPanle,将其添加到Window中,并在Window中添加按钮,调试,一切正常,按钮点击可以工作。随,又写了一个Panel,继承于这个FormPanel,并将其加入到TabPanel中,同样的为其添加按钮,调试,显示一切正常,可是按钮却不能工作了!点击事件失效了!!代码如下:

  1. POWindow=Ext.extend(Ext.Window,{
  2. form:null,
  3. constructor:function(){
  4. this.form=newPOFormPanel();
  5. POWindow.superclass.constructor.call(this,{
  6. width:600,
  7. autoHeight:true,
  8. modal:true,//模式窗体
  9. onEsc:Ext.emptyFn,
  10. plain:true,
  11. resizable:false,
  12. //minimizable:true,
  13. //closable:false,
  14. closeAction:"hide",
  15. constrain:false,
  16. layout:"form",
  17. items:[this.form],
  18. buttonAlign:"center",
  19. buttons:[{
  20. text:"SaveAsDraft",
  21. handler:this.SaveButtonClick,
  22. scope:this
  23. },{
  24. text:"Submit",
  25. handler:this.SubmitButtonClick,
  26. scope:this
  27. },{
  28. text:"Cancel",
  29. handler:this.CancelButtonClick,
  30. scope:this
  31. }]
  32. });
  33. },
  34. SaveButtonClick:function(btn,e){
  35. alert(Ext.encode(this.form.getValues().data));
  36. },
  37. SubmitButtonClick:function(btn,e){
  38. alert(Ext.encode(this.form.getValues().data));
  39. },
  40. CancelButtonClick:function(btn,e){
  41. this.hide();
  42. this.form.reset();
  43. }
  44. });
  45. //==============================================================================
  46. /**/
  47. POTabFormPanel=Ext.extend(POFormPanel,{
  48. //frame:true,
  49. title:"PurchaseOrder",
  50. closable:true,
  51. autoScroll:true,
  52. buttonAlign:"center",
  53. buttons:[{
  54. text:"SaveAsDraft",
  55. handler:this.SaveButtonClick,
  56. scope:this
  57. },{
  58. text:"Submit",
  59. handler:this.SubmitButtonClick,
  60. scope:this
  61. },{
  62. text:"Cancel",
  63. handler:this.CancelButtonClick,
  64. scope:this
  65. }],
  66. constructor:function(_cfg){
  67. if(_cfg)
  68. Ext.apply(_cfg);
  69. POTabFormPanel.superclass.constructor.call(this);
  70. },
  71. SaveButtonClick:function(){
  72. alert("SaveButtonClick");
  73. //alert(Ext.encode(this.getValues().data));
  74. },
  75. SubmitButtonClick:function(btn,e){
  76. alert(Ext.encode(this.getValues().data));
  77. },
  78. CancelButtonClick:function(btn,e){
  79. this.reset();
  80. }
  81. });

一直不知道是哪里出了问题,上网Google了一下也没有找到答案,只有自己摸索解决了。

 

凝视了代码好久,脑子里突然想到之前听陈治文老师视频中讲到的“设计时代码”和“运行时代码”,那问题会不会是出现在这里呢?我试着将Buttons的代码移到其构造函数里,再次调试,按钮单击正常工作了!!!

  1. POTabFormPanel=Ext.extend(POFormPanel,{
  2. frame:true,
  3. //title:"PurchaseOrder",
  4. closable:true,
  5. autoScroll:true,
  6. constructor:function(_cfg){
  7. if(_cfg)
  8. Ext.apply(this,_cfg);
  9. POTabFormPanel.superclass.constructor.call(this,{
  10. buttonAlign:"center",
  11. buttons:[{
  12. text:"SaveAsDraft",
  13. handler:this.SaveButtonClick,
  14. scope:this
  15. },{
  16. text:"Submit",
  17. handler:this.SubmitButtonClick,
  18. scope:this
  19. },{
  20. text:"Cancel",
  21. handler:this.CancelButtonClick,
  22. scope:this
  23. }]
  24. });
  25. },
  26. SaveButtonClick:function(){
  27. alert("SaveButtonClick");
  28. //Ext.log("SaveButtonClick");
  29. alert(Ext.encode(this.getValues().data));
  30. },
  31. SubmitButtonClick:function(btn,e){
  32. alert(Ext.encode(this.getValues().data));
  33. Ext.log(Ext.encode(this.getValues().data))
  34. },
  35. CancelButtonClick:function(btn,e){
  36. this.reset();
  37. }
  38. });

问题得到了解决,记录在我的Blog中,方便其他遇到类似问题的朋友参阅!!

 

 

版权声明:本文为博主原创文章,未经博主允许不得转载。

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics