Extjs中引入JSP页面

时间:2022-02-13 11:18:40

有的时候,我们可能要在某个panel中动态的引入一个jsp页面。但是ext中貌似没有这样的方法,所以这时候需要我们自定义一个组件来完成我们的需求。 1.首先定义我们的penel。

Ext.define('Qibotean.view.myTestPanel', {            extend : 'Ext.panel.Panel' ,            alias : 'widget.myTestPanel'  ,           id :  'myTestPanel' ,            closable : true ,            layout : 'border' ,            frame : true ,            html : '
 

'   });

2.这里我们调用显示这个panel。

var t = Ext.widget({                  id :  testPanel,                 xtype :  testPanel });

3.在这个panel传到页面后我们调用我们的组件修改传输的内容。

Ext.create  ('Qibotean.util.loadJsp' , {                        url : $PRO_PATH +  '/test/page/myTestPage.jsp' ,                         innerHtmlId : 'myTestPage'                      }).loading() ; // 加载jsp页面

4,定义我们的组件

Ext.define('Qibotean.util.loadJsp',{      config    : {         url    : '', //myJsp路径          innerHtmlId : '' //要放入的DomId     },      loading : function() {          var url = this.url;         var innerHtml = this.innerHtml;         //注意,这里用Ajax的原因是,我们的jsp页面可能会引用到后台返回来的数据,如果不需要的话,直接          //document.getElementByIdx_x_x_x_x_x_x_x(innerHtmlId).innerHTML  = ret.response.Text;就可以          Ext.Ajax.request({             url     : url,             success    : function(){                  document.getElementById(innerHtmlId).innerHTML = ret.response.Text;              }         }) ;     },      //构造函数     constructor : function (config){          var a = this;          a.initConfig(config); //初始化配置      }        })

5. 写入我们的jsp页面代码就行

转载请注明作者:晌午十一点半(http://www.cnblogs.com/qibotean) 原文地址:http://www.cnblogs.com/qibotean/p/4549974.html