各位大侠好,我是一名才接触EXT 不久,最近遇到一个比较头疼的问题,问题大致是这样的,我有一个VIEWPORT(viewport.jsp) 的页面,里面已经布好了局了,在这个页面里我已经用到了Ext.onReady 这个东西,我是希望能够点击左边的树菜单能把相应的页面加载到VIEWPORT 中的 CENTER 页面中来,需要加载的页面也使用了EXT 里相关的JS,而且是一个可以单独运行出来页面,所以加载到VIEWPORT 中的时候就出来问题了,根本就加载不进来。 在网上查了很多资料,实在解决不了,我想知道在实际的项目应用中是怎么处理的? 希望各位大侠能指点迷津,谢谢了!

解决方案 »

  1.   

    点击左边的tree菜单,在center布局面板中添加一个panel
    panel的autoLoad: "指向你要显示的url即可"tree.on("click", function (node) {
        //centerPanel是tabPanel
        centerPanel.add({
            title: "新tab"+ node.text,
            closable: true,
            autoLoad: {url: "your page url", params: "username=abc&pwd=12345"}
        }).show();
        //centerpanel 是panel
        centerPanel.setTitle("new Panel" + node.text);
        centerPanel.load({url: "your_page_url", params: "method=show&id=112"});
    }, this);当然你可以在panel的html中用iframe
    {
       xtype: "panel",
       html: "<iframe src='your url'/>"
    }
      

  2.   


    你好,首先感谢你的回答,但是这样的话可能会有问题的,因为我要加载的页面是包含有EXT 代码的,而且是能够独立运行出来的,所以如果加载的话会有问题, 还有一个就是使用 iframe 的话是可以的,但是我想不使用 iframe 。不知道有没有好的解决方案呢? 
      

  3.   

    那就是这种
    直接带页面地址即可
    tree.on("click", function (node) {
        //centerPanel是tabPanel
        centerPanel.add({
            title: "新tab"+ node.text,
            closable: true,
            autoLoad: {url: "your page url", params: "username=abc&pwd=12345"}
            script: true//这里可以带script的
        }).show();
        //centerpanel 是panel
        centerPanel.setTitle("new Panel" + node.text);
        centerPanel.load({url: "your_page_url", params: "method=show&id=112"});
    }, this);
      

  4.   

    恩,请问你能发一个非常简单的例子给我么?我这边那样处理也不行,加 scripts:true,也是不行的,我在用FF 调试的时候,根本就没有把要加载的JSP 页面中的JS 加载进来!
      

  5.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>extCombox.html</title>

        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" type="text/css" href="ext-2.2/resources/css/ext-all.css" />
        <script type="text/javascript" src="ext-2.2/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="ext-2.2/ext-all.js"></script>
        <script type="text/javascript">
         Ext.onReady(function () {
        

    var panel = new Ext.Panel({
    renderTo: Ext.get("show"),
    title: "test",
    height: 200,
    width: 200,
    autoLoad: {url: "test1.html", scripts: true}
    });
    panel.load({url: "test1.html", scripts: true});
         });
        </script>
      </head>
      
      <body>
        <div id="show"></div>
      </body>
    </html>test1.html<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>test1.html</title>

        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        
        <link rel="stylesheet" type="text/css" href="ext-2.2/resources/css/ext-all.css" />
        <script type="text/javascript" src="ext-2.2/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="ext-2.2/ext-all.js"></script>
    <script type="text/javascript">
    Ext.onReady(function () {
    new Ext.Button({text: "btn", renderTo: Ext.getBody()});
    Ext.Msg.alert("info", "excetue");
    });
    window.onload = function () {
    alert('load...');//不被执行
    };
    </script>
      </head>
      
      <body>
        <a href="javascript: alert(3);">This is my HTML page. <br></a>
        <script>
         alert(1);
        </script>
      </body>
    </html>
    注意代码要放到应用服务器下执行,如tomcat、jboss
      

  6.   

    你改了test1.html的内容没有,那里的js导入路径对不对,你自己看看
      

  7.   

    你把要掉用的页面中所有的引用都删了,只在主页面留一些必要的Extjs引用
      这个是主页面
    这是引用页面