Use of ExtJs radiogroup
/*** Detailed management of payment channels ** @ 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, // tag width autoScroll: true, labelAlign: 'right ', // label alignment bodyStyle: 'padding: 5 5 0', // the margin buttonAlign: 'center' for form elements and form panels, and height: Adjust E Nt. body. clientHeight-400, items: [{layout: 'column', xtype: 'fieldset', title: 'Basic information', anchor: '123', autoHeight: true, border: true, items: [{columnWidth :. 33, layout: 'form', labelWidth: 120, // defaultType: 'textfield ', border: false, items: [{fieldLabel: 'Channel connection id', name: 'connid', xtype: 'textfield ', // set to the type of the text input box readOnly: true, anchor: '20140901'}, new Ext. form. comboBox ({hiddenName: 'C OnnType ', fieldLabel: 'Connection type', triggerAction: 'all', store: CONNTYPEStore, displayField: 'text', valueField: 'value', mode: 'local', forceSelection: true, // The selected content must be the Sub-item editable: false, typeAhead: true, resizable: true, anchor: '000000'}), {fieldLabel: 'url encoding ', // tag xtype: 'textfield ', name: 'charset', // name: the backend can use this attribute to set the value to anchor: '6666661'}, {fieldLabel: 'replace connection id', // tag xtype: 'textfield', name: 'Replace id', // name: the backend determines anchor: '000000' based on this name attribute, {fieldLabel: 'Connection timeout time', // tag xtype: 'textfield ', name: 'conntimeout', // name: the backend determines anchor: '000000' based on this name attribute, {fieldLabel: 'operator', name: 'operid', xtype: 'textfield', // set it to readOnly: true, anchor: '000000'}]}, {columnWidth :. 33, layout: 'form', labelWidth: 120, // defaultType: 'textfield ', border: false, items: [{fieldLabel: 'canal Dao Code', name: 'channelcode', xtype: 'textfield ', // set to the type of the text input box readOnly: true, anchor: '000000'}, {fieldLabel: 'Access method', xtype: 'radiogroup', columns: 2, items: [{boxLabel: "SOCKET", id: 'protocoltype0', name: "protocolType", inputValue: "0" },{ boxLabel: "HTTP", id: 'coltype1', name: "protocolType", inputValue: "1"}] },{ fieldLabel: 'activate use', xtype: 'radiogroup', columns: 2, items: [{boxLabel: "Not activated", id: 'actived0', name: "actived", inputValue: "0"}, {boxLabel: "activated", id: 'actived1', name: "actived", inputValue: "1"}]}, {fieldLabel: 'whether auto-population is activated ', xtype: 'radiogroup', columns: 2, items: [{boxLabel: "activation", name: "resumeActived", id: 'resumeactived1', inputValue: "1" },{ boxLabel: "Not activated", id: 'resumeactived0', name: "resumeActived", inputValue: "0"}]}, {fieldLabel: 'read timeout time', name: 'readtim Eout', xtype: 'textfield ', // set it to the text input box type anchor: '000000'}, {fieldLabel: 'Operation time', // tag xtype: 'datefield ', name: 'opdate', // name: the backend uses the format: 'Y-m-d H: I: s' value based on this name attribute, // format the date readOnly: true, anchor: '000000'}]}, {columnWidth :. 33, layout: 'form', labelWidth: 150, // defaultType: 'textfield ', border: false, items: [{fieldLabel: 'Connection name', name: 'connname', xtype: 'textfield ', // set it to the text input box type anchor: '000000'}, {fieldLabel: 'whether or not the same channel type prevails ', xtype: 'radiogroup', columns: 2, items: [{boxLabel: "Yes", id: 'priority0', name: "priority", inputValue: "Y" },{ boxLabel: "no", id: 'priority1', name: "priority", inputValue: "N"}] },{ fieldLabel: 'replenishment method ', xtype: 'radiogroup', columns: 2, items: [{boxLabel: "true complement", name: "resumeType", id: 'resumetype1', inputValue: "1" },{ boxLabel: "false complement", name: "resumeType ", Id: 'resumetype0', inputValue: "0"}]}, {fieldLabel: 'Gateway type sharding ', xtype: 'radiogroup', columns: 2, items: [{boxLabel: "Yes", name: "connTypeDetachable", id: 'conntypedetachable0', inputValue: "Y"}, {boxLabel: "no", name: "connTypeDetachable ", id: 'conntypedetachable1', inputValue: "N"}]}, {fieldLabel: 'Refund of service fees upon return ', xtype: 'radiogroup', columns: 2, items: [{boxLabel: "", name: "is_refund_with_fee ", Id: 'Is _ refund_with_fee0', inputValue:" 0 "}, {boxLabel:" Not returned ", name:" is_refund_with_fee ", id: 'Is _ refund_with_fee1 ', inputValue: "1"}]}, {fieldLabel: 'Channel rate', name: 'feerate', xtype: 'textfield ', // set it to the text input box type anchor: '20140901'}]}, {layout: 'column', xtype: 'fieldset', title: 'sequence name, address, description', anchor: '20160301 ', autoHeight: true, border: true, items: [{columnWidth: 1, layout: 'form', labelWidth: 130, // Tag width defaultType: 'textfield', border: false, items: [{fieldLabel: 'Channel payment order sequence name', name: 'chnl _ ord_no_seqname', xtype: 'textfield', // set it to the text input box type anchor: '000000'}, {fieldLabel: 'Channel payment connection url', name: 'connurl', xtype: 'textfield ', // set it to the text input box type anchor: '000000'}, {fieldLabel: 'Channel query connection url', name: 'connqueryurl', xtype: 'textfield ', // set it to the text input box type anchor: '000000'}, new Ext. form. textArea ({fieldLabel: "Description ", Name: 'description', labelSepartor: ', labelWidth: 60, width: '000000'})]}, {layout: 'column', xtype: 'fieldset', title: 'account information', anchor: '000000', autoHeight: true, border: true, items: [{columnWidth :. 5, layout: 'form', labelWidth: 220, // defaultType: 'textfield ', border: false, items: [{fieldLabel: 'virtual financial company Payment Exchange (principal) ', name: 'vtl _ sf_payee_prcpl_acct', xtype: 'textfield ', // set it to the text input box type anc Hor: '000000'}, {fieldLabel: 'virtual financial company payment revenue (principal) ', name: 'vtl _ sf_fi_prcpl_acct', xtype: 'textfield ', // set it to the text input box type anchor: '000000'}, {fieldLabel: 'virtual bank payment transactions (bank accounting service fee) ', name: 'vtl _ bk_fo_fee_acct', xtype: 'textfield', // set it to the text input box type anchor: '000000'}, {fieldLabel: 'payment service fee (internal accounting service fee) ', name: 'sf _ fi_fee_acct ', xtype: 'textfield ', // set it to the text input box type anchor: '000000'}]}, {columnWidth :. 5, layout: 'form', labelWidth: 220, // tag width defaultType: 'textfield', border: false, items: [{fieldLabel: 'virtual bank payment transaction (principal) ', name: 'vtl _ bk_fo_prcpl_acct ', xtype: 'textfield', // set to text input box type anchor: '000000'}, {fieldLabel: 'virtual payment service fee (bank accounting service fee) ', name: 'vtl _ sf_fo_fee_acct ', xtype: 'textfield', // set it to the text input box type anchor: '000000'}, {fieldLabel: 'Financial company's normal payment income (principal) ', name: 'sf _ fi_prcpl_acct', xtype: 'textfield ', // set it to the text input box type anchor: '123 '},{ FieldLabel: 'Financial company transitional return payment income (principal) ', name: 'sf _ rfd_fi_prcpl_acct', xtype: 'textfield ', // set it to text input box type anchor: '000000'}]}); // initialization form initForm (title, secondForm, record, function (sWindow) {if (! SecondForm. form. isValid () {Ext. messageBox. alert ("prompt", "Please enter the correct data"); 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 () ['resumable']; var con NTypeDetachable = secondForm. getForm (). getValues () ['conntypedetachable']; var is_refund_with_form = secondForm. getForm (). getValues () ['is _ refund_with_fee ']; Ext. msg. confirm ("prompt", "Are you sure you want to save? ", Function (btn) {if (btn =" yes ") {secondForm. getForm (). submit ({url: 'connworkflow manage. do? ReqCode = updateconn1_mangeinfo ', waitTitle:' submitting ....... ', method: 'post', params: {protocolType: protocolType, actived: actived, resumeActived: resumeActived, priority: priority, resumeType: resumeType, connTypeDetachable: priority, priority: priority }, success: function (form, action) {Ext. msg. hide (); if (action. result. success) {Ext. msg. alert ('hprompt ', action. result. msg); SWindow. close (); store. reload ();} else {Ext. msg. alert ('hprompt ', action. result. msg); Ext. msg. hide (); store. reload () ;}, failure: function (form, action) {Ext. msg. hide (); store. reload (); Ext. msg. alert ('hprompt ', action. result. msg) ;}};}}) ;});/** initialization form */function initForm (title, secondForm, record, saveFun) {// initialize if (record! = Null) {secondForm. getForm (). loadRecord (record);} // Add button secondForm. addButton ({text: 'save', id: 'save _ click', iconCls: 'accepticon ', handler: function () {saveFun (sWindow) ;}}); secondForm. addButton ({text: 'reset ', iconCls: 'tbar _ synchronizeIcon', handler: function () {secondForm. getForm (). reset (); setValuetoForm () ;}}); secondForm. addButton ({text: 'close', iconCls: 'deletecon ', handler: function () {sWindow. Close () ;}}); uiGrantFree (); var sWindow = new Ext. window ({title: ''+ title +'', // Window title layout: 'fit ', // set the Window layout mode width: document. body. clientWidth-100, // The window width, such as height: 650, closable: false, // whether closeAction: 'hide 'can be disabled, // maximizable: false, // set whether border: false can be maximized, // set 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 ('resumed'); var priority = record. get ('priority '); var resumeType = record. get ('resumable'); var connTypeDetachable = record. get ('conntypedetachable'); var is_refund_with_records = 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 ('resumed0 '). setValue (resumeActived);} else if (resumeActived = "1") {Ext. getCmp ('resumed1 '). 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_future = "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 );}}}