<!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><%@ page contentType="text/html;charset=UTF-8"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>onReady</title>
<link rel="stylesheet" type="text/css"
href="/ext/resources/css/ext-all.css" />
<script type="text/javascript" src="/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="/ext/ext-all.js"></script>
<script type="text/javascript">
function myPanel()
{
itemsA = [
{
fieldLabel:"UserName",//文本框标题
name:"user",
id:"user",
},
{
fieldLabel:"PassWord",
inputType:"password",
name:"pass",
id:"pass",
}
];
itemsB = [
{
xtype:'fieldset',
title: '个人信息',
collapsible: true,
autoHeight:true,
width:330,
defaults: {width: 150},
defaultType: 'textfield',
items :[{
fieldLabel: '爱好',
name: 'hobby',
value: 'www.cnblogs.com'
},{
xtype:"combo",
name: 'sex',
store:["男","女","保密"],//数据源为一数组
fieldLabel:"性别",
emptyText:'请选择性别.'
}]
}
];
var form1 = new Ext.form.FormPanel(
{
width:350,
frame:true,//圆角和浅蓝色背景
renderTo:"form1",//呈现
title:"FormPanel",
bodyStyle:"padding:5px 5px 0",
defaults:{width:200,xtype:"textfield"},
items:itemsB,
buttons:[{text:"确定"},{text:"取消",handler:function(){alert("事件！");}}]
});
}
Ext.onReady(myPanel);
</script>
</head>
<body>
<div id="form1"></div>
</body>
</html>
分享到：
相关推荐
Ext的FormPanel组件说明formPanel的详细使用说明
(1)Ext.FormPanel f.getForm().submit({ url:”……”, params:{ XX:xx …..} success: function (c,v,e) { //e: 触发事件 var json=Ext.decode(v.response.responseText); }, failure:function(c,v,e){} }) (2)Ext....
.archExtJs2.0学习系列(7)--Ext.FormPanel之第四式(其他组件示例篇).doc
6. ExtJs2.0学习系列(6)--Ext.FormPanel之第三式(ComboBox篇) 7. ExtJs2.0学习系列(7)--Ext.FormPanel之第四式(其他组件示例篇) 8. ExtJs2.0学习系列(8)--Ext.FormPanel之第五式(综合篇) 9. ExtJs2.0学习系列(9)--...
在使用使用FormPanel时我们通常需要使用它的form对象来加载数据或提交数据。...doAction方法带有两个参数，其中第二个参数为从load或submit 方法传递过来的Ext.form.Action对象的配置数据（Config Options）
使用 Ext.form.FormPanel 来处理数据时候，某些字段是需要只读的。当然我们可以使用 Ext.form.TextField，然后设置成 ReadOnly，不过这样子的显示效果不是很好，因为始终会有个输入框。所以我们必须使用 Ext.form....
三、将ext-2.3.0、CKEditor 3.0.1、ckfinder_asp_1.4，取出解压后的文件夹，真接放到站点根目录，目录结构为： WEBROOT ｜--ckeditor ｜--finder ｜--ext-2.3.0 ｜--js ｜--css 修改ckeditor目录下的config.js如下...
第3章 Ext Core实例—.NET语言实现 35 3.1 创建应用并设置开发环境 35 3.2 自定义Membership提供程序 37 3.3 创建母版页 38 3.4 首页设计 42 3.5 产品列表页 47 3.6 产品详细信息页 51 3.7 登录对话框 56 3.8 用户...
本篇是关于Ext.Ajax + Ext.FormPanel + MySQL数据库的完整登录案例,一个是html的form表单,一个是Ext的FormPanel表单,在提交或结合Ext.Ajax多少还是有区别的.
-增加示例(iframe/parent_postback_run3.aspx)，如何通过简单的Javascript代码回发父页面(feedback:eroach)。 -修正一些书写错误(feedback:bmck)。 -从Region控件中删除SplitColor属性，增加CollapseMode, ...
Ext table布局实例 formpanel的table布局
//第二句的目的就是设置控件的错误信息显示位置，主要可选的位置有： var tdate = new Ext.form.DateField({ fieldLabel: ‘日期’, emptyText: ‘请选择日期’, format: ‘Y-m-d’, disabledDays: [0, 7] });...
代码如下: /** * 提交表单 */ function $postForm(a) { if (a.formPanel.getForm().isValid()) { var b = a.scope ? a.scope: this; a.formPanel.getForm().submit({ scope: b, url: a.url, method: “post”, ...
this.formpanel = new Ext.FormPanel({ items: [{ fieldLabel: ‘代码’, name: ‘FCode’, anchor:’100%’, id: ‘fid’ },{ fieldLabel: ‘名称’, name: ‘FName’, anchor:’100%’ // anchor width by ...
下面是一个我遇到问题代码的简化版本，没有经过测试，大概意思是要是在form里想控制不显示表单，用remove()方法有效 代码如下: new Ext.form.FormPanel({ id : ‘ReportForm’,items : [{ {id:”001″}, {id:”002″...
new Ext.form.FormPanel({ height : 90, width:500, labelWidth : 200, labelPad : 0, renderTo :'auto', frame : true, items : [ { xtype : 'combo', triggerAction : 'query', forceSelection : true,...
Extjs中的表单组件是Ext.form.BasicForm，不过最简单最常用的是Ext.form.FormPanel控件，它继承自Panel，具有一定的界面显示控制能力，它其中包含着一个BasicForm对象，用来执行向服务器提交，加载等动作。...
第3章 表格控件 28 3.1 Grid的特性简介 28 3.2 制作一个简单的Grid 29 3.3 Grid常用功能详解 32 3.3.1 部分属性功能 32 3.3.2 自主决定每列的宽度 33 3.3.3 让Grid支持按列排序 35 3.3.4 解决中文排序 35 ...