ExtJs 表单渲染根本没有发生
Posted
技术标签:
【中文标题】ExtJs 表单渲染根本没有发生【英文标题】：ExtJs Form Rendering not happening at all 【发布时间】：2013-03-06 12:44:42 【问题描述】：我正在尝试使用 ExtJS 创建一个表单。文件放置正确，但没有进行渲染：
index.html
<html>
<head>
<title>Hello Ext</title>
<link rel="stylesheet" type="text/css" href="../extjs/resources/css/ext-all.css">
<script type="text/javascript" src="../extjs/ext-debug.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</head>
<body>
<div id="aa"></div>
</body>
</html>
app.js
Ext.create('Ext.form.Panel',
renderTo: document.getElementById('aa'),
title: 'User Form',
height: 130,
width: 280,
bodyPadding: 10,
defaultType: 'textfield',
items: [
fieldLabel: 'First Name',
name: 'firstName'
,
fieldLabel: 'Last Name',
name: 'lastName'
,
xtype: 'datefield',
fieldLabel: 'Date of Birth',
name: 'birthDate'
]
);
有人知道我错过了什么吗？
谢谢
【问题讨论】：
【参考方案1】：在您的 app.js 中，尝试在触发 onReady 事件时运行该代码，例如
Ext.onReady(function()
Ext.create('Ext.form.Panel',
renderTo: document.getElementById('aa'),
title: 'User Form',
height: 130,
width: 280,
bodyPadding: 10,
defaultType: 'textfield',
items: [
fieldLabel: 'First Name',
name: 'firstName'
,
fieldLabel: 'Last Name',
name: 'lastName'
,
xtype: 'datefield',
fieldLabel: 'Date of Birth',
name: 'birthDate'
]
);
);
【讨论】：
非常感谢格兰特，我想通了【参考方案2】：只需使用Ext.onReady():
添加一个在 DOM 准备好时调用的函数，所有必需的 类已加载。
如果 DOM 准备好并且所有的类都已加载，则传递的函数是 立即执行。
工作示例：http://jsfiddle.net/Ld5e6/
【讨论】：
非常感谢 CD 。明白了，没有触发 onReady()以上是关于ExtJs 表单渲染根本没有发生的主要内容，如果未能解决你的问题，请参考以下文章