ExtJs的radiogroup的使用

/**
 * 支付渠道管理详细
 * 
 * @param {}
 *            title
 * @param {}
 *            record
 * @param {}
 *            readonly
 * @param {}
 *            store
 */
function showConnCfgDetail(title, record, store) {

	var secondForm = new Ext.form.FormPanel({
		region : 'center',
		collapsible : false,
		border : true,
		labelWidth : 60, // 标签宽度
		autoScroll : true,
		labelAlign : 'right', // 标签对齐方式
		bodyStyle : 'padding:5 5 0', // 表单元素和表单面板的边距
		buttonAlign : 'center',
		height : document.body.clientHeight - 400,
		items : [{
					layout : 'column',
					xtype : 'fieldset',
					title : '基础信息',
					anchor : '98%',
					autoHeight : true,
					border : true,
					items : [{
								columnWidth : .33,
								layout : 'form',
								labelWidth : 120, // 标签宽度
								defaultType : 'textfield',
								border : false,
								items : [{
											fieldLabel : '渠道连接ID',
											name : 'connId',
											xtype : 'textfield', // 设置为文字输入框类型
											readOnly : true,
											anchor : '100%'
										}, new Ext.form.ComboBox({
													hiddenName : 'connType',
													fieldLabel : '连接类型',
													triggerAction : 'all',
													store : CONNTYPEStore,
													displayField : 'text',
													valueField : 'value',
													mode : 'local',
													forceSelection : true, // 选中内容必须为下拉列表的子项
													editable : false,
													typeAhead : true,
													resizable : true,
													anchor : '100%'
												}), {
											fieldLabel : 'URL编码', // 标签
											xtype : 'textfield',
											name : 'charSet', // name:后台根据此name属性取值
											anchor : '100%'
										}, {
											fieldLabel : '代替连接ID', // 标签
											xtype : 'textfield',
											name : 'replaceConnId', // name:后台根据此name属性取值
											anchor : '100%'
										}, {
											fieldLabel : '连接超时时间', // 标签
											xtype : 'textfield',
											name : 'connTimeOut', // name:后台根据此name属性取值
											anchor : '100%'
										}, {
											fieldLabel : '操作员',
											name : 'operId',
											xtype : 'textfield', // 设置为文字输入框类型
											readOnly : true,
											anchor : '100%'
										}]
							}, {
								columnWidth : .33,
								layout : 'form',
								labelWidth : 120, // 标签宽度
								defaultType : 'textfield',
								border : false,
								items : [{
											fieldLabel : '渠道代码',
											name : 'channelCode',
											xtype : 'textfield', // 设置为文字输入框类型
											readOnly : true,
											anchor : '100%'
										}, {
											fieldLabel : '访问方式',
											xtype : 'radiogroup',
											columns : 2,
											items : [{
														boxLabel : "SOCKET",
														id : 'protocolType0',
														name : "protocolType",
														inputValue : "0"
													}, {
														boxLabel : "HTTP",
														id : 'protocolType1',
														name : "protocolType",
														inputValue : "1"
													}]
										}, {
											fieldLabel : '是否激活使用',
											xtype : 'radiogroup',
											columns : 2,
											items : [{
														boxLabel : "不激活",
														id : 'actived0',
														name : "actived",
														inputValue : "0"
													}, {
														boxLabel : "激活",
														id : 'actived1',
														name : "actived",
														inputValue : "1"
													}]
										}, {
											fieldLabel : '自动补功能是否激活',
											xtype : 'radiogroup',
											columns : 2,
											items : [{
														boxLabel : "激活",
														name : "resumeActived",
														id : 'resumeActived1',
														inputValue : "1"
													}, {
														boxLabel : "不激活",
														id : 'resumeActived0',
														name : "resumeActived",
														inputValue : "0"
													}]
										}, {
											fieldLabel : '读取超时时间',
											name : 'readTimeOut',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}, {
											fieldLabel : '操作时间', // 标签
											xtype : 'datefield',
											name : 'opDate', // name:后台根据此name属性取值
											format : 'Y-m-d H:i:s', // 日期格式化
											readOnly : true,
											anchor : '100%'
										}]
							}, {
								columnWidth : .33,
								layout : 'form',
								labelWidth : 150, // 标签宽度
								defaultType : 'textfield',
								border : false,
								items : [{
											fieldLabel : '连接名称',
											name : 'connName',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}, {
											fieldLabel : '是否在同渠道同类型中优先',
											xtype : 'radiogroup',
											columns : 2,
											items : [{
														boxLabel : "是",
														id : 'priority0',
														name : "priority",
														inputValue : "Y"
													}, {
														boxLabel : "否",
														id : 'priority1',
														name : "priority",
														inputValue : "N"
													}]
										}, {
											fieldLabel : '补单方式',
											xtype : 'radiogroup',
											columns : 2,
											items : [{
														boxLabel : "真补",
														name : "resumeType",
														id : 'resumeType1',
														inputValue : "1"
													}, {
														boxLabel : "假补",
														name : "resumeType",
														id : 'resumeType0',
														inputValue : "0"
													}]
										}, {
											fieldLabel : '网关类型可拆分',
											xtype : 'radiogroup',
											columns : 2,
											items : [{
														boxLabel : "是",
														name : "connTypeDetachable",
														id : 'connTypeDetachable0',
														inputValue : "Y"
													}, {
														boxLabel : "否",
														name : "connTypeDetachable",
														id : 'connTypeDetachable1',
														inputValue : "N"
													}]
										}, {
											fieldLabel : '退货时是否退还手续费',
											xtype : 'radiogroup',
											columns : 2,
											items : [{
														boxLabel : "退还",
														name : "is_refund_with_fee",
														id : 'is_refund_with_fee0',
														inputValue : "0"
													}, {
														boxLabel : "不退还",
														name : "is_refund_with_fee",
														id : 'is_refund_with_fee1',
														inputValue : "1"
													}]
										}, {
											fieldLabel : '渠道费率',
											name : 'feeRate',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}]
							}]

				}, {
					layout : 'column',
					xtype : 'fieldset',
					title : '序列名、地址、描述',
					anchor : '98%',
					autoHeight : true,
					border : true,
					items : [{
								columnWidth : 1,
								layout : 'form',
								labelWidth : 130, // 标签宽度
								defaultType : 'textfield',
								border : false,
								items : [{
											fieldLabel : '渠道支付订单序列名称',
											name : 'chnl_ord_no_seqname',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}, {
											fieldLabel : '渠道支付连接URL',
											name : 'connUrl',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}, {
											fieldLabel : '渠道查询连接URL',
											name : 'connQueryUrl',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}, new Ext.form.TextArea({
													fieldLabel : "描述",
													name : 'description',
													labelSepartor : ':',
													labelWidth : 60,
													width : '100%'
												})]
							}]

				}, {
					layout : 'column',
					xtype : 'fieldset',
					title : '账户信息',
					anchor : '98%',
					autoHeight : true,
					border : true,
					items : [{
								columnWidth : .5,
								layout : 'form',
								labelWidth : 220, // 标签宽度
								defaultType : 'textfield',
								border : false,
								items : [{
											fieldLabel : '虚拟财务公司支付往来(本金)',
											name : 'vtl_sf_payee_prcpl_acct',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}, {
											fieldLabel : '虚拟财务公司支付收入(本金)',
											name : 'vtl_sf_fi_prcpl_acct',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}, {
											fieldLabel : '虚拟银行支付往来(银行核算手续费)',
											name : 'vtl_bk_fo_fee_acct',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}, {
											fieldLabel : '支付手续费收入(内部核算手续费)',
											name : 'sf_fi_fee_acct',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}]
							}, {
								columnWidth : .5,
								layout : 'form',
								labelWidth : 220, // 标签宽度
								defaultType : 'textfield',
								border : false,
								items : [{
											fieldLabel : '虚拟银行支付往来(本金)',
											name : 'vtl_bk_fo_prcpl_acct',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}, {
											fieldLabel : '虚拟支付手续费支出(银行核算手续费)',
											name : 'vtl_sf_fo_fee_acct',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}, {
											fieldLabel : '财务公司过渡正常支付收入(本金)',
											name : 'sf_fi_prcpl_acct',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}, {
											fieldLabel : '财务公司过渡退货支付收入(本金)',
											name : 'sf_rfd_fi_prcpl_acct',
											xtype : 'textfield', // 设置为文字输入框类型
											anchor : '100%'
										}]
							}]

				}]
	});

	// 初始化表单
	initForm(title, secondForm, record, function(sWindow) {
		if (!secondForm.form.isValid()) {
			Ext.MessageBox.alert("提示", "请正确填写数据");
			return;
		}
		var protocolType = secondForm.getForm().getValues()['protocolType'];
		var actived = secondForm.getForm().getValues()['actived'];
		var resumeActived = secondForm.getForm().getValues()['resumeActived'];
		var priority = secondForm.getForm().getValues()['priority'];
		var resumeType = secondForm.getForm().getValues()['resumeType'];
		var connTypeDetachable = secondForm.getForm().getValues()['connTypeDetachable'];
		var is_refund_with_fee = secondForm.getForm().getValues()['is_refund_with_fee'];

		Ext.Msg.confirm("提示", "确认保存?", function(btn) {
			if (btn == "yes") {
				secondForm.getForm().submit({
							url : 'connCfgManage.do?reqCode=updateConnCfgMangeInfo',
							waitTitle : '正在提交中.......',
							method : 'POST',
							params : {
								protocolType : protocolType,
								actived : actived,
								resumeActived : resumeActived,
								priority : priority,
								resumeType : resumeType,
								connTypeDetachable : connTypeDetachable,
								is_refund_with_fee : is_refund_with_fee
							},
							success : function(form, action) {
								Ext.Msg.hide();
								if (action.result.success) {
									Ext.Msg.alert('提示', action.result.msg);
									sWindow.close();
									store.reload();
								} else {
									Ext.Msg.alert('提示', action.result.msg);
									Ext.Msg.hide();
									store.reload();
								}
							},
							failure : function(form, action) {
								Ext.Msg.hide();
								store.reload();
								Ext.Msg.alert('提示', action.result.msg);
							}
						});
			}
		});
	});

	/** 初始化表单 */
	function initForm(title, secondForm, record, saveFun) {
		// 初始化
		if (record != null) {
			secondForm.getForm().loadRecord(record);
		}
		// 添加按钮
		secondForm.addButton({
					text : '保存',
					id : 'save_button',
					iconCls : 'acceptIcon',
					handler : function() {
						saveFun(sWindow);
					}
				});
		secondForm.addButton({
					text : '重置',
					iconCls : 'tbar_synchronizeIcon',
					handler : function() {
						secondForm.getForm().reset();
						setValuetoForm();
					}
				});
		secondForm.addButton({
					text : '关闭',
					iconCls : 'deleteIcon',
					handler : function() {
						sWindow.close();
					}
				});

		uiGrantFree();
		
		var sWindow = new Ext.Window({
					title : '<span style="font-weight:bold">' + title
							+ '</span>', // 窗口标题
					layout : 'fit', // 设置窗口布局模式
					width : document.body.clientWidth - 100, // 窗口宽度
					height : 650,
					closable : false, // 是否可关闭
					closeAction : 'hide', // 关闭策略
					maximizable : false, // 设置是否可以最大化
					border : false, // 边框线设置
					resizable : false,
					constrain : true,
					titleCollapse : true,
					animateTarget : Ext.getBody(),
					autoScroll : false,
					modal : true,
					buttonAlign : 'right',
					items : [secondForm],
					buttons : []
				});
		sWindow.show();
	}

	if (record != null) {
		setValuetoForm();
	}

	function setValuetoForm() {
		var protocolType = record.get('protocolType');
		var actived = record.get('actived');
		var resumeActived = record.get('resumeActived');
		var priority = record.get('priority');
		var resumeType = record.get('resumeType');
		var connTypeDetachable = record.get('connTypeDetachable');
		var is_refund_with_fee = record.get('is_refund_with_fee');

		if (protocolType == "0") {
			Ext.getCmp('protocolType0').setValue(protocolType);
		} else if (protocolType == "1") {
			Ext.getCmp('protocolType1').setValue(protocolType);
		}
		if (actived == "0") {
			Ext.getCmp('actived0').setValue(actived);
		} else if (actived == "1") {
			Ext.getCmp('actived1').setValue(actived);
		}
		if (resumeActived == "0") {
			Ext.getCmp('resumeActived0').setValue(resumeActived);
		} else if (resumeActived == "1") {
			Ext.getCmp('resumeActived1').setValue(resumeActived);
		}
		if (priority == "Y") {
			Ext.getCmp('priority0').setValue(priority);
		} else if (priority == "N") {
			Ext.getCmp('priority1').setValue(priority);
		}
		if (resumeType == "0") {
			Ext.getCmp('resumeType0').setValue(resumeType);
		} else if (resumeType == "1") {
			Ext.getCmp('resumeType1').setValue(resumeType);
		}
		if (connTypeDetachable == "Y") {
			Ext.getCmp('connTypeDetachable0').setValue(connTypeDetachable);
		} else if (connTypeDetachable == "N") {
			Ext.getCmp('connTypeDetachable1').setValue(connTypeDetachable);
		}
		if (is_refund_with_fee == "0") {
			Ext.getCmp('is_refund_with_fee0').setValue(is_refund_with_fee);
		} else if (is_refund_with_fee == "1") {
			Ext.getCmp('is_refund_with_fee1').setValue(is_refund_with_fee);
		}
	}
}

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。