- From 전송시에 Serialize 포멧으로 변경한다.
- Database에 Mybatic에서 바로 저장할 경우에 주로 사용한다.
- 데이터는 encodeURI으로 변환한다.
- Ajax를 통해 서버로 전송한다.
- From 전송시에 vtype 통하여 표현을 위해 사용된 기호를 제거한다. (ex : 2012-02-19 -> 20120219)
- vtype을 통해 데이터 무결성을 검증한다.
- vtype 종류
① phone : 전화번호 검증
② money : 금액(원) 검증
③ jumin : 달력 검증
④ bisid : 주민번호 검증
⑤ date : 사업자번호 검증
⑥ notKor : 한글입력 방지
⑦ isKor : 한글만 입력
⑧ date : 달력 검증
⑨ email: 메일 검증(extjs에서 기본 제공)
- plugins 을 통해 포멧을 변경하고, 한글 입력을 방지한다.
- plugins 종류
① Ext.ux.plugin.FormatPhoneNumber : 전화번호 포멧 변경
② Ext.ux.plugin.FormatMoneyNumber : 금액 포멧 변경
③ Ext.ux.plugin.FormatDateNumber : 달력 포멧 변경
④ Ext.ux.plugin.FormatJuminNumber : 주민번호 포멧 변경
⑤ Ext.ux.plugin.FormatBisidNumber : 사업자번호 포멧 변경
⑥ Ext.ux.plugin.FormatNotHangul : 한글입력 방지
- 금액을 표현할 경우에는 renderer : Ext.util.Format.numberRenderer('0,000.0')을 사용한다.
<#ftl encoding="utf-8"><#--File Name : viewCustomer.ftlSub-System Name : 고객 상세조회Description : 고객 상세조회최종작성일 : 2012.08.28최종작성자: 윤혁신--><script language="javascript" type="text/javascript">var formSet;Ext.onReady(function(){// 신규 저장 버튼Ext.create('Ext.Button', {id : 'btn_add_save',text : '전송',style: { padding: "2px 5px 2px 5px" },renderTo: 'div_btn_add_save',handler : function() {//console.log(formSet.getForm().getValues());var submitForm = formSet.getForm().getValues();//console.log("clientnm : " + formSet.getForm().getValues()['clientnm']);//console.log("clientnm : " + submitForm['clientnm']);//formSet.getForm().findField('title').setValue('clientnm value');//console.log("----------------------");//console.log(formSet.getForm().getValues());//console.log(formSet.getForm());//console.log(formSet.getForm().getValues()['sub_txt']);//formSet.getForm().findField('sub_txt').setText('clientnm value');//formSet.getForm().getValues()['sub_txt'].setText('11');formSet.getForm().setValues({sub_data: ''});console.log( fncExtSerialize(formSet.getForm()) );formSet.getForm().setValues({sub_data: fncExtSerialize(formSet.getForm())});if ( !formSet.getForm().isValid() ) {Ext.Msg.alert("알림", "필수 항목을 입력해주세요.");return;}//console.log("isValid : " + formSet.getForm().isValid());console.log( fncExtSerialize(formSet.getForm()) );//console.log( fncExtJson(formSet.getForm()) );//console.log("======================");//console.log( JSON.stringify(fncExtJson(formSet.getForm())) );//submitForm['clientnm'].allowBlank = false;/*var valFlag = fncValidCheck("dataForm");if (!valFlag) {return false;}Ext.MessageBox.confirm('저장', '저장하시겠습니까?',function(btn){if (btn == "yes") {/*var form = this.up('form').getForm();fields = form.getFields();Ext.each(fields.items, function (f) {f.inputEl.dom.disabled = true;});*///field.up('form').getForm().submit();/*$.ajax({url: "<@spring.url '/infomgmt/addCustomerPrc.do'/>",type: "post",data: $('#dataForm').serialize(),dataType: "json",beforeSend: function(){},success: function(jsonObj){Ext.MessageBox.hide();Ext.Msg.alert("알림", "저장되었습니다.");setTimeout(function(){Ext.MessageBox.hide();}, 2000);//window.location.href = "<@spring.url '/infomgmt/addCustomerPrc.do'/>";}});}});*/} // function() end.});// 고객등급 Store 정의var codeListC005 = Ext.create('Ext.data.Store', {//autoDestroy: true,fields: ['code', 'code_nm'],data : [<#if codeListC005?has_content><#list codeListC005 as item>{"code":"${item.code?default('')}", "code_nm":"${item.code_nm?default('')}"},</#list></#if>]});//저장 field 선언formSet = new Ext.FormPanel({id : 'searchForm',frame: true,waitMsgTarget: true,defaultType: 'textfield',items: [{//IDname: 'cust_id',renderTo : 'div_cust_id',width : 150,maxLength : 20,vtype: 'notKor',cls : 'input_color1',allowBlank: false, //필수값plugins: new Ext.ux.plugin.FormatNotHangul()}, {//이름name: 'cust_nm',renderTo : 'div_cust_nm',width : 150,maxLength : 50,vtype: 'isKor',cls : 'input_color1',allowBlank: false //필수값}, {//전화name: 'cpy_telno',renderTo : 'div_cpy_telno',width : 150,vtype: 'phone',cls : 'input_color1',allowBlank: false,plugins: new Ext.ux.plugin.FormatPhoneNumber()}, {//휴대전화name: 'cpy_hp',renderTo : 'div_cpy_hp',width : 150,vtype: 'phone',cls : 'input_color1',allowBlank: false,plugins: new Ext.ux.plugin.FormatPhoneNumber()}, {name: 'email',renderTo : 'div_email',width : 150,vtype: 'email',cls : 'input_color1',allowBlank: false}, {//월급name: 'money',renderTo : 'div_money',width : 150,vtype: 'money',cls : 'input_color1',allowBlank: false, //필수값maxLength : 10,plugins: new Ext.ux.plugin.FormatMoneyNumber()//cls : 'input_type3'}, {//주민번호name: 'jumin',renderTo : 'div_jumin',width : 150,vtype: 'jumin',plugins: new Ext.ux.plugin.FormatJuminNumber()//cls : 'input_type3'}, {//사업자번호name: 'bisid',renderTo : 'div_bisid',width : 150,vtype: 'bisid',plugins: new Ext.ux.plugin.FormatJuminNumber()}, {//성별xtype: 'radiogroup',name: 'sex',columns: [60, 100],renderTo : 'div_sex',//cls : 'input_color3',allowBlank: false,items: [{boxLabel: '양력', name: 'sex', inputValue: 'S'},{boxLabel: '음력', name: 'sex', inputValue: 'L'}]}, {//생년월일name: 'birthday',renderTo : 'div_birthday',width : 100,vtype: 'date',plugins: new Ext.ux.plugin.FormatDateNumber()}, {//등급xtype: 'combo',name: 'clientgrade',width : 100,renderTo : 'div_clientgrade',store: codeListC005,valueField: 'code',displayField: 'code_nm',allowBlank: false,cls : 'input_color1',editable : false}, {//특기사항xtype: 'textareafield',name: 'etc',renderTo : 'div_etc',width : 500,rows : 4}, {//등록자name: 'reg_name',renderTo : 'div_reg_name',width : 150,value : '윤혁신',readOnly: true,cls : 'input_color2'}, {//전송내역xtype: 'textareafield',name: 'sub_data',renderTo : 'div_sub_data',fieldStyle : 'background-color: #F2F2F5; background-image: none;',readOnly: true,width : 650,rows : 8}, {//전송내역(Label)xtype: 'label',name: 'sub_txt',id : 'sub_txt',//renderTo : 'div_sub_txt',text: 'My Awesome Field',//width : 450,//height: 80anchor:'93%'}]});}) // Ext.onready End</script><!-- 설명--><div>- From 전송시에 Serialize 포멧으로 변경한다.<br>- Database에 Mybatic에서 바로 저장할 경우에 주로 사용한다.<br>- 데이터는 encodeURI으로 변환한다.<br>- Ajax를 통해 서버로 전송한다.<br>- From 전송시에 vtype 통하여 표현을 위해 사용된 기호를 제거한다. (ex : 2012-02-19 -> 20120219)<br>- vtype을 통해 데이터 무결성을 검증한다.<br>- vtype 종류<br> ① phone : 전화번호 검증<br> ② money : 금액(원) 검증<br> ③ jumin : 달력 검증<br> ④ bisid : 주민번호 검증<br> ⑤ date : 사업자번호 검증<br> ⑥ notKor : 한글입력 방지<br> ⑦ isKor : 한글만 입력<br> ⑧ date : 달력 검증<br> ⑨ email: 메일 검증(extjs에서 기본 제공)<br>- plugins 을 통해 포멧을 변경하고, 한글 입력을 방지한다.<br>- plugins 종류<br> ① Ext.ux.plugin.FormatPhoneNumber : 전화번호 포멧 변경<br> ② Ext.ux.plugin.FormatMoneyNumber : 금액 포멧 변경<br> ③ Ext.ux.plugin.FormatDateNumber : 달력 포멧 변경<br> ④ Ext.ux.plugin.FormatJuminNumber : 주민번호 포멧 변경<br> ⑤ Ext.ux.plugin.FormatBisidNumber : 사업자번호 포멧 변경<br> ⑥ Ext.ux.plugin.FormatNotHangul : 한글입력 방지<br>- 금액을 표현할 경우에는 renderer : Ext.util.Format.numberRenderer('0,000.0')을 사용한다.<br></div><div class="sub_btn_area"><div class="btn_right"><div id="div_btn_add_save" auth=“C" btn_id="btn_add_save" style="float:left;padding-left:5px"></div> <!-- 신규저장 --></div></div><div class="tbl_box mt5"><table class="tbl_ext_item"><colgroup><col width="25%" /><col width="25%" /><col width="25%" /><col /></colgroup><tbody><tr><th>ID (영문자/숫자만 입력)</th><td><div id="div_cust_id" /></td><th>이름 (한글만 입력)</th><td><div id="div_cust_nm" /></td></tr><tr><th>회사전화 (전화 FORMAT)</th><td><div id="div_cpy_telno" /></td><th>휴대전화(전화 FORMAT)</th><td><div id="div_cpy_hp" /></td></tr><tr><th>E-mail (FORMAT)</th><td><div id="div_email" /></td><th>월급(금액 FORMAT)</th><td><div id="div_money" /></td></tr><tr><th>주민번호 (주민 FORMAT)</th><td><div id="div_jumin" /></td><th>사업자번호 (사업자 FORMAT))</th><td><div id="div_bisid" /></td></tr><tr><th>성별 (RADIO)</th><td><div id="div_sex" /></td><th>생년월일(달력 FORMAT)</th><td><div id="div_birthday" /></td></tr><tr><th>등급 (COMBO)</th><td colspan="3"><div id="div_clientgrade" /></td></tr><tr><th>특기사항 (TEXTBOX)</th><td colspan="3"><div id="div_etc" /></td></tr><tr><th>등록자 (READ ONLY)</th><td colspan="3"><div id="div_reg_name" /></td></tr></tbody></table><br /><br /><table class="tbl_default"><colgroup><col width="25%" /><col /></colgroup><tbody><tr><th>전송내역(serialize)</th><td><div id="div_sub_data" /></td></tr></tbody></table></div>
댓글 없음:
댓글 쓰기