Question

早些时候，我的应用程序使用的是框架，其中jsp页面使用extjs网格来显示数据。现在我正在尝试删除帧并使用extjs选项卡进行显示。我能够在选项卡中包含jsp页面标签内的 autoLoad：{url：＆＃34; test.jsp＆＃34;} 。但我的问题是extjs网格没有显示出来。在搜索时我刚刚通过定义找到了 autoLoad：{url：＆＃34; test.jsp＆＃34;，scripts：true} 它会激活jsp页面内的脚本。但在运行我的应用程序时，它会显示 ext未定义。我不知道它是如何发生的，因为我在我的jsp文件中包含了ext-all脚本。请帮助我知道方法是否正确，或者在使用extjs选项卡时如何显示网格。

的MainPage

Ext.onReady(function(){
 Ext.create('Ext.tab.Panel', {
 height:300,
   items: [
        {
            title: 'eRAM summary',
            autoLoad: {url: 'test1.jsp',scripts:true},
            closable:true
        }
    ],
    renderTo : document.body
});

test.jsp 包含网格

<script>
function getRandomDate() {
    var from = new Date(1900, 0, 1).getTime();
    var to = new Date().getTime();
    return new Date(from + Math.random() * (to - from));
}
function createFakeData(count) {
        var firstNames   = ['Ed', 'Tommy', 'Aaron', 'Abe'];
        var lastNames    = ['Spencer', 'Maintz', 'Conran', 'Elias'];

        var data = [];
        for (var i = 0; i < count ; i++) {
            var dob = getRandomDate();           
            var firstNameId = Math.floor(Math.random() * firstNames.length);
            var lastNameId  = Math.floor(Math.random() * lastNames.length);
            var name        = Ext.String.format("{0} {1}", firstNames[firstNameId], lastNames[lastNameId]);

            data.push([name, dob]);
        }
        return data;
    }
Ext.onReady(function(){   
     Ext.define('Person',{
        extend: 'Ext.data.Model',
        fields: [
            'Name', 'dob'
        ]
    });

// create the Data Store
var store = Ext.create('Ext.data.Store', {
    model: 'Person',
    autoLoad: true,
    proxy: {
        type: 'memory',
            data: createFakeData(10),
            reader: {
                type: 'array'
            }
    }
});
// create the grid
Ext.create('Ext.grid.Panel', {
    store: store,
    columns: [
        {text: "Name", width:120, dataIndex: 'Name'},
        {text: "dob", width: 380, dataIndex: 'dob'}
    ],
    renderTo:'example-grid',
    width: 500,
    height: 280
    });    
});
</script>

这是我尝试在我的应用程序中嵌入的示例

Answer 1

你使用

吗？

   <c:url>

同时包括ext-all.js？

像这样

<head>
   <link href="<c:url value='/resources/css/ext-all.css' />" rel="stylesheet">
   <script src="<c:url value='/extjs/ext-debug.js' />" type="text/javascript"></script>
   <script src="<c:url value='/resources/css/ext-all.css' />app/app.js" type="text/javascript"></script>
</head>

ExtJS - 在选项卡中嵌入带有extjs网格的jsp页面

1 个答案: