浏览 4984 次
|
锁定老帖子 主题：ext编辑器
该帖已经被评为新手帖
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2008-06-27
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>我的测试</title> <link rel="stylesheet" type="text/css" href="css/ext-all.css" /> <script type="text/javascript" src="js/ext-base.js"></script> <script type="text/javascript" src="js/ext-all.js"></script> <script type="text/javascript"> Ext.onReady(function(){ // HtmlEditor需要这个 Ext.QuickTips.init(); var form = new Ext.form.FormPanel({ labelAlign: 'right', labelWidth: 50, width: 600, title: 'form', frame: true, items: [{ layout: 'column', items: [{ columnWidth:.7, xtype:'fieldset', checkboxToggle:true, title: '单纯输入', autoHeight:true, defaults: {width: 300}, defaultType: 'textfield', items: [{ fieldLabel: '文本', name: 'text' },{ xtype: 'numberfield', fieldLabel: '数字', name: 'number' },{ xtype:"combo", fieldLabel: '选择', name: 'combo', store: new Ext.data.SimpleStore({ fields: ['value', 'text'], data: [ ['value1', 'text1'], ['value2', 'text2'] ] }), displayField: 'text', valueField: 'value', mode: 'local', emptyText:'请选择' },{ xtype: 'datefield', fieldLabel: '日期', name: 'date' },{ xtype: 'timefield', fieldLabel: '时间', name: 'time' },{ xtype: 'textarea', fieldLabel: '多行', name: 'textarea' },{ xtype: 'hidden', name: 'hidden' }] },{ columnWidth:.3, layout:'form', items:[{ xtype:'fieldset', checkboxToggle:true, title: '多选', autoHeight:true, defaultType: 'checkbox', hideLabels: true, style: 'margin-left:10px;', bodyStyle: 'margin-left:20px;', items: [{ boxLabel: '首先要穿暖', name: 'check', value: '1', checked: true, width: 'auto' },{ boxLabel: '然后要吃饱', name: 'check', value: '2', checked: true, width: 'auto' },{ boxLabel: '房子遮风避雨', name: 'check', value: '3', width: 'auto' },{ boxLabel: '行路方便', name: 'check', value: '4', width: 'auto' }] },{ xtype:'fieldset', checkboxToggle:true, title: '单选', autoHeight:true, defaultType: 'radio', hideLabels: true, style: 'margin-left:10px;', bodyStyle: 'margin-left:20px;', items: [{ boxLabel: '渴望自由', name: 'rad', value: '1', checked: true, width: 'auto' },{ boxLabel: '祈求爱情', name: 'rad', value: '2', width: 'auto' }] }] }] },{ layout: 'form', labelAlign: 'top', items: [{ xtype: 'htmleditor', fieldLabel: '在线编辑器', id: 'editor', anchor: '98%' }] }], buttons: [{ text: '保存' },{ text: '读取' },{ text: '取消' }] }); form.render("form"); }); </script> </head> <body> <script type="text/javascript" src="js/examples.js"></script> <div id="form" style="margin:20px;"></div> </body> </html> 这是一个很不错的ext编辑器！希望大家学习学习！ 声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
|
发表时间：2008-06-27
真好！
请问一下 引用 frame: true, 是什么意思？我拿掉后，界面和以前不一样了。我还是不清楚 它实际含义是什么 ？
还有 引用 layout: 'column', 引用 layout: 'form', colum和form两个属性有什么区别？
还有 那个 那个最下面的文本编辑器 怎么设置高度 ？ |
| 返回顶楼 | |
|
发表时间：2008-06-28
查一下ext api嘛!应该不难的!
|
| 返回顶楼 | |
