ExtJs2.0学习系列(7)--Ext.FormPanel之第四式(其他组件示例篇)

11.checkbox简单示例
效果图:

 附件: 您所在的用户组无法下载或查看附件


js代码:

Code


关于多列布局,我们可以使用column或者table布局解决!
//其他几个参数
1.checked:true//true则选中,默认为false
2.name:"**"//name值
3.value:""//初始化值,默认为undefine

12.radio简单示例
基本上和checkbox一样,不过注意一组单选框必须name值相同,才能单选。
效果图:

 附件: 您所在的用户组无法下载或查看附件
代码:

Code


13.htmleditor简单示例
效果图:

 附件: 您所在的用户组无法下载或查看附件
js代码:

Code


在这里我啰嗦个参数:
//labelAlign参数
  labelAlign:此参数是指form表单中items各项的label位置,默认值为left,枚举值有left,right,top
//我看见过有朋友认为此参数指title的位置,是错误的!
几个其他的参数:

//补充几个参数
1.hideLabel:true//默认为false,还适用于有标签的所有表单组件
//下面的一组参数控制编辑器的工具栏选项,都是默认值为true
2.enableColors:true//默认为true,显示字体颜色,字体背景颜色
3.enableAlignments:true//左,中,右对齐
4.enableFont:true//字体
5.enableFontSize:false//字体大小,就是A旁边有个小箭头的
6.enableFormat:false//粗体,斜体,下划线
7.enableLinks:true//链接
8.enableLists:true//列表
9.enableSourceEdit:true//源代码编辑

14.datefield简单示例
效果图:

 附件: 您所在的用户组无法下载或查看附件

js代码:

Code


15.timefield简单示例
把上面的例子中datefield改为timefield,效果图:

 附件: 您所在的用户组无法下载或查看附件

16.numberfield简单示例:
把上面的datefield改为numberfield,就只能输入数字了

17.triggerfield简单示例
说明:它提供了一个触发的事件onTriggerClick,datefield和combox都是继承它
效果图:(点击右边下拉按钮)

 附件: 您所在的用户组无法下载或查看附件


js代码:

Code


好了,关于form的几个基本组件我们都蜻蜓点水的看了一遍,相信大家感性上知道是怎么回事啦!(总算快写完了formpanel)
前面有朋友说要做个一行多个控件,中间有文字的那种form布局,谢谢支持!
下篇我们就做一个复杂点的form组件,还能提交服务器的综合示例!敬请期待!

原文出处:http://www.cnblogs.com/qianxudet ... /08/03/1259032.html

 感谢原创者的辛勤劳动,希望对您有所帮助,转载请注明原出处。
 您可能对 [ExtJS] 的这些文章也感兴趣:

ExtJS与.NET结合开发实例
ExtJs中tabPanel放置iframe无法兼容IE6的解决方法
ExtJs2.0学习系列(1)--Ext.MessageBox
ExtJs2.0学习系列(3)--Ext.Window
ExtJs2.0学习系列(8)--Ext.FormPanel之第五式(综合篇)
Extjs 做的信息管理系统
DateField的奇怪问题
基于ExtJs2.0日期时间(DateTime)控件的升级版本
Ext.data库中几个常用类的原理及其使用
ExtJS 中使用Asp.net编写后台服务器程序的几种方式