在用extbuilder eclipse插件的时候,自动生成的代码,如何把他放在jsp中进行显示,这个问题,对于初用extbuilder 的人可能不太会,我在网上找到,自己试了,可以显示出来。这里先记来了。
这里是生成的代码。
- Ext.namespace('test');
- test.test = function(config) {
- Ext.applyIf(this, config);
- this.initUIComponents();
- test.test.superclass.constructor.call(this);
- };
- Ext.extend(test.test, Ext.Panel, {
- initUIComponents : function() {
-
- Ext.apply(this, {
- items : [{
- frame : "true",
- layout : "form",
- items : [{
- xtype : "textfield"
- }, {
- xtype : "textfield"
- }, {
- xtype : "datefield"
- }],
- xtype : "form"
- }]
- });
-
- }
- });
非常简单的代码。
下面来看我们的页面,我这里用的是html,因为没有动态无素。
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=GBK">
- <title>test</title>
-
- <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" mce_href="resources/css/ext-all.css" />
- <mce:script type="text/javascript" src="../../adapter/ext/ext-base.js" mce_src="adapter/ext/ext-base.js"></mce:script>
- <mce:script type="text/javascript" src="../../ext-all.js" mce_src="ext-all.js"></mce:script>
- <mce:script type="text/javascript" src="../../ext-lang-zh_CN.js" mce_src="ext-lang-zh_CN.js" charset="utf-8"></mce:script>
- <link rel="stylesheet" type="text/css" href="../shared/examples.css" mce_href="shared/examples.css" />
-
- <mce:script type="text/javascript"><!--
- Ext.namespace('test');
- test.test = function(config) {
- Ext.applyIf(this, config);
- this.initUIComponents();
- test.test.superclass.constructor.call(this);
- };
- Ext.extend(test.test, Ext.Window, {
- initUIComponents : function() {
-
- Ext.apply(this, {
- el:'test',
- width :600,
- height :400,
- items : [{
- frame : "true",
- layout : "form",
- items : [{
- xtype : "textfield"
- }, {
- xtype : "textfield"
- }, {
- xtype : "datefield"
- }],
- xtype : "form"
- }]
- });
-
- }
- });
-
-
- Ext.onReady(function(){
- var tt = new test.test({
- el:'test'
- });
- tt.show();
- });
-
-
-
- <body>
-
- <div id='test' name="test"></div>
-
-
- </body>
- </html>
这样就OK了。这里给大家指出改动的地方。
自动生的是:
Ext.extend(test.test, Ext.Panel, {
initUIComponents : function() {
// BEGIN OF CODE GENERATION PARTS, DON'T DELETE CODE BELOW
Ext.apply(this, {
items : [{
改动成:
Ext.extend(test.test, Ext.Window, {
initUIComponents : function() {
// BEGIN OF CODE GENERATION PARTS, DON'T DELETE CODE BELOW
Ext.apply(this, {
el:'test',
width :600,
height :400,
items : [{
最后要加上这段:
Ext.onReady(function(){
var tt = new test.test({
el:'test'
});
tt.show();
});
html中只有一个div,id是test
弄好以后就可以在页面中显示效果了。