ExtJs2.0里Ext.form.Radio水平排列布局

ExtJs2.0好像不支持单选框组,因此用两个name相同单选框来实现单选框组

var radio1 = new Ext.form.Radio({boxLabel:‘男‘,name:‘sex‘,id:‘yes‘,inputValue:‘0‘,width : 150, height : 20});

var radio2 = new Ext.form.Radio({boxLabel:‘女‘,name:‘sex‘,id:‘no‘,inputValue:‘1‘, width : 150,height : 20});

//性别配置FieldSet

var fieldSet = new Ext.form.FieldSet({

title : ‘性别配置‘,

autoHeight : true,

width : 350,

labelAlign : ‘right‘,

labelwidth : 110,

bodyStyle : ‘padding:5px 5px 0‘,

layout:‘column‘,

items : [{

columnWidth : .5,

items:radio1  //radio1一定要写在单独的items里面,不然在页面显示的效果就是两个单选框的圆圈在前面,两个单选框选项的描述在后面

},

{

columnWidth : .5,

items: radio2

}]

});

var fp = new Ext.FormPanel({

id : ‘sex_mode‘,

labelWidth : 110,

waitMsg : ‘正在提交,请稍后...‘,

frame : true,

width : 380,

autoHeight : true,

layout:‘column‘,

items : [fieldSet]

});

var winKey = new Ext.Window({

id : "sex_win",

title : ‘[性别]维护‘,

autoHeight :true,// 320,

width : 400,

closeAction : ‘hide‘,

closable:false,

iconCls : ‘add‘,

modal : true,

buttons : [{

text : ‘提交‘,

id : ‘button‘,

handler : function() {

var sex = fp.form.findField("sex").getGroupValue();

if(sex != ‘‘ && sex != undefined && sex != null){

fp.form.submit({

url : ‘‘,  //配置性别的方法

waitTitle : "[性别]修改",

waitMsg : ‘正在提交数据,请稍后... ...‘,

success : function(form, action) {

Ext.MessageBox.alert(‘提示信息‘,action.result.msg);

},

failure : function(form, action) {

Ext.MessageBox.alert(‘提示信息‘, "更新性别有误!");

}

});

}else{

Hs.util.Msg(‘提示信息‘, ‘请选择性别!‘);

}

}

}],

items : [fp]

});

时间: 2024-10-25 00:17:38

ExtJs2.0里Ext.form.Radio水平排列布局的相关文章

EXt form属性

配置项: success:执行成功后回调的函数,包括两个参数:form和action failure:执行失败后回调的函数,包括两个参数:form和action method:表单的提交方式,有效值包括GET.POST params:传递到请求中的参数 url:动作提交的路径 waitMsg:动作执行时显示的等待信息 属性: Action.CLIENT_INVALID:客户端验证错误 Action.CONNECT_FAILURE:通信错误 Action.LOAD_FAILURE:加载数据时,没有

Ext.form.ComboBox 后台取值 动态加载 ext5.0.0

我用的extjs是5.0.0版本的. 开始的时候keyup事件取到的数据就是放不到ComboBox中,放全局变量也不好用.最后大神出手帮忙解决了这个问题~~~ 查看API的时候,对象没有找对,以至于方法事件都用不了. 总结出来方便查阅~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 输入号码结束--触发事件---从后台取数据---将数据放到下拉列表中 输入手机号 // 输入电话号 var $inpTel = new Ext.form.TextField({ fieldLabel: '

水平排列居中两种方法总结

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>水平排列方法</title> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> </head> <

Bootstrap 表单和图片 (内联表单,表单合组,水平排列,复选框和单选框,下拉列表,校验状态,添加额外的图标,控制尺寸,图片)

一.表单 基本格式 注:只有正确设置了输入框的 type 类型,才能被赋予正确的样式. 支持的输入框控件 包括:text.password.datetime.datetime-local.date.month.time.week. number.email.url.search.tel 和 color. <form> <div class="form-group"> <label>电子邮件</label> <input type=&

ExtJs 第二章,Ext.form.Basic表单操作

1.认识Ext.form.Panel表单面板         Ext.form.field.CheckBox 复选框 checkboxfield Ext.form.CheckBoxGroup 复选框组 checkboxgroup Ext.form.field.ComboBox 下拉列表框 combo Ext.form.field.Date 日期选择框 datefield Ext.form.field.Display 文本展示组件 displayfield Ext.form.FieldContai

bootstrap-表单控件——单选按钮水平排列

1.运行效果如图所示 2.实现代码如下 <!DOCTYPE html> <html> <head>     <meta charset="utf-8">     <meta http-equiv="X-UA-Compatible" content="IE=edge">     <title>表单控件--单选按钮水平排列</title>     <!-- 最新

Ext JS表单Ext.form.FormPanel

1.表单 对于传统的b/s应用来说,数据录入元素是放在表单<form>标签里面的.而对于ExtJS应用来说,则可以直接使用FormPanel控件来存放表单中的元素.FormPanel继承自Panel,在Panel的基础上提供与表单相关的各种特性,比如可以指定表单提交的url.指定表单提交方式.是否是二进制提交等:另外FormPanel固定使用form布局,前面关于布局一节中的内容我们说过,form布局也就是专门用于组织包含输入元素的布局. 看下面的代码: 1 Ext.onReady(funct

【干货】:如何让元素水平排列?

块级元素默认是垂直排列的,而行内元素是水平排列的,而在布局时基本上都是用块级元素,如div等常用块级标签,那么如何让块级元素也进行水平排列呢?我有100种方式(准确说是100-94种)让元素水平排列,你知道几种呢? 第一种:display:inline-block 首先得先了解块级元素(block elements)和行内元素(inline elements)以及行内块状元素(inline-block elements) 块级元素:块级元素包含width height,padding,borde

Ext.form.Panel表单面板

1.Ext.form.FormPanel支持的主要表单组件 ExtJS表单组件 说明 Xtype类型 Ext.form.field.CheckBox 复选框 checkboxfield Ext.form.CheckBoxGroup 复选框组 checkboxgroup Ext.form.field.ComboBox 下拉列表框 combo Ext.form.field.Date 日期选择框 datefield Ext.form.field.Display 文本显示组件 displayfield