refactor : html페이지의 form에 데이터 셋팅하는 함수명 수정(setFormData -> FimsFormFields.set)

main
이범준 2 years ago
parent c884081cb5
commit 117b2b9eee

@ -82,7 +82,9 @@ Date Author Description
const data = res.data?.contents;
if(data){
setFormData(document.querySelector('form'), data);
let formFields = new FimsFormFields("form");
formFields.set(data);
orgData = $('form').serialize();
}

@ -338,7 +338,8 @@ Date Author Description
window.opener.ARR_NAV[window.opener.CUR_TAB_IDX].reloadNav($('#prev'), $('#next'), $('span#totCnt'))
fnPopupBiz.resetDisplay(res.ctznDTO?.cvplRceptNo);
setFormData(document.querySelector('#frm'), {...res.ctznDTO, ...res.payerDTO, ...res.infoDTO});
let formFields = new FimsFormFields("#frm");
formFields.set({...res.ctznDTO, ...res.payerDTO, ...res.infoDTO});
orgData = $('form').serialize();
}

@ -722,8 +722,11 @@ Date Author Description
fnPopupBiz.resetDisplay(res.ctznDTO?.cvplRceptNo);
$('#violtDtlsNm').text(res.ctznDTO?.violtDtlsNm);
setFormData(document.querySelector('#frmReglt'), {...res.ctznDTO, ...res.infoDTO});
setFormData(document.querySelector('#frmPayer'), res.payerDTO);
let formFields1 = new FimsFormFields("#frmReglt");
formFields1.set({...res.ctznDTO, ...res.infoDTO});
let formFields2 = new FimsFormFields("#frmPayer");
formFields2.set(res.payerDTO);
schParam = {
regltId: res.infoDTO?.regltId,

@ -198,8 +198,10 @@
,data: params
,success: (res) => {
cmmImgDownload('#imgList', res.attchFiles, fnBiz.pagePopup, true);
window.opener.pageNav.reloadNav($('#prev'), $('#next'), $('#totCnt span'))
setFormData(document.querySelector('form'), res.extrDTO);
window.opener.pageNav.reloadNav($('#prev'), $('#next'), $('#totCnt span'));
let formFields = new FimsFormFields("form");
formFields.set(res.extrDTO);
}
})
}

@ -272,10 +272,14 @@
,data: params
,success: (res) => {
cmmImgDownload('#imgList', res.attchFiles, fnBiz.pagePopup, true);
window.opener.pageNav.reloadNav($('#prev'), $('#next'), $('#totCnt span'))
setFormData(document.getElementsByName('frmStmt'), res.ctznDTO);
window.opener.pageNav.reloadNav($('#prev'), $('#next'), $('#totCnt span'));
let formFields = new FimsFormFields("form[name='frmStmt']");
formFields.set(res.ctznDTO);
for(let idx; idx<res.ctznDtlDTOs.length; idx++){
setFormData(document.getElementsByName('frmStmtDtl0'+idx), res.ctznDtlDTOs[idx]);
let formFields = new FimsFormFields("form[name='frmStmtDtl"+idx+"']");
formFields.set(res.ctznDtlDTOs[idx]);
}
}
})

@ -141,8 +141,10 @@
,data: params
,success: (res) => {
cmmImgDownload('#imgList', res.attchFiles, fnBiz.pagePopup, true);
window.opener.pageNav.reloadNav($('#prev'), $('#next'), $('span#totCnt'))
setFormData(document.querySelector('form'), res.dto);
window.opener.pageNav.reloadNav($('#prev'), $('#next'), $('span#totCnt'));
let formFields = new FimsFormFields("form");
formFields.set(res.dto);
}
})
}

@ -16,7 +16,7 @@
<script type="text/javascript" src="${ctx}/resources/js/base/base.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/base/dataset.js"></script>
<!-- jquery datepicker custom -->
<script type="text/javascript" src="${ctx}/resources/lib/fims/framework/datepicker/datepicker.js" ></script>

@ -113,7 +113,9 @@ Date Author Description
// /webapp/resources/js/fims/framework/cmm/cmmUtil.js
// 사용예 : 단속관리 > 단속현황 관리 > 초기자료편집 - /WEB-INF/jsp/fims/biz/cmm/cmmCrackdownEditPopup.jsp
// 사용예 : 단속관리 > 단속현황 관리 > 개별총정보 - /WEB-INF/jsp/fims/biz/cmm/cmmCrackdownTotMgtPopup.jsp
setFormData(document.querySelector('#frm'), res.cmmnDetailCode);
let formFields = new FimsFormFields("#frm");
formFields.set(res.cmmnDetailCode);
orgData = $('form').serialize();
}
})

File diff suppressed because it is too large Load Diff

@ -485,81 +485,86 @@ function setDateTimeFmt2(srcDateStr, delimiter = '-') {
}
}
class FimsFormFields extends FormFields {
/**
* form json data set
* element tag에 data-fmt-type 으로 데이타 format이 지정된 경우 해당 포맷으로 출력
* @param {object} formObj document.querySelector('form')
* @param {object} jsonData json type data
*/
set(obj){
document.querySelectorAll(this.children).forEach(input => {
let prop = input.getAttribute("data-map")
|| input.name
|| input.id;
if (!prop) return;
let dataItem = obj instanceof DataItem,
value = dataItem ? obj.getValue(prop) : obj[prop];
if ("radio" == input.type) {
if (value && value == input.value)
input.checked = true;
} else if("checkbox" == input.type) {
if (value && value == input.value)
input.checked = ("Y" === value);
} else if(input.tagName == "SELECT") {
for(let option of input.options) {
if(option.value == value){
option.selected = true;
} else {
option.selected = false;
}
}
} else {
if(value == null){
value = "";
}
// element data-fmt-type에 정의된 format 적용
// dt - yyyy-mm-dd HH:mm:ss, day - yyyy-mm-dd, time - HH:mm:ss, number - #,###
if(input.dataset.fmtType){
const fmtType = input.dataset.fmtType;
switch (fmtType) {
case 'dt' :
value = setDateTimeFmt(value);
break;
case 'day' :
value = setDateFmt(value);
break;
case 'time' :
value = setTimeFmt(value);
break;
case 'number' :
value = setComma(value);
break;
default:
break;
}
}
if(input.name){
/**
* form json data set
* 태그명으로 일치 - 동일 태그명이 여럿존재하는 경우 idx만 set
* element tag에 data-fmt-type 으로 데이타 format이 지정된 경우 해당 포맷으로 출력
* @param {object} formObj document.querySelector('form')
* @param {object} jsonData json type data
* @param {number} idx 태그명 배열의 index (default = 0)
*/
function setFormData(formObj, jsonData, idx= 0){
let els = formObj.elements;
if(!els) els = formObj[0];
for(let e of els){
if(e.tagName === 'BUTTON') continue;
let val = jsonData[e.name] ?? '';
if(val && e.tagName === 'SELECT') {
//console.log(e.name, val, e.tagName)
// 동적으로 binding한 element에는 attr() 적용 불가
$('select[name=' + e.name + ']').find('option[value=' + val + ']').prop("selected", true);
continue;
}
if(val && e.tagName === 'INPUT' && e.type === 'checkbox') {
//console.log(e.name, val, e.tagName)
// 동적으로 binding한 element에는 attr() 적용 불가
$('input:checkbox[name=' + e.name + ']').prop('checked', "Y" === val);
continue;
}
if(val && e.tagName === 'INPUT' && e.type === 'radio') {
//console.log(e.name, val, e.tagName)
// 동적으로 binding한 element에는 attr() 적용 불가
const $elRadio = $('input:radio[name=' + e.name + ']:radio[value='+val+']');
$elRadio.prop('checked', $elRadio.val() === val);
continue;
}
input.value = value;
// element data-fmt-type에 정의된 format 적용
// dt - yyyy-mm-dd HH:mm:ss, day - yyyy-mm-dd, time - HH:mm:ss, number - #,###
if(e.dataset.fmtType){
const fmtType = e.dataset.fmtType;
switch (fmtType) {
case 'dt' :
val = setDateTimeFmt(val );
break;
case 'day' :
val = setDateFmt(val);
break;
case 'time' :
val = setTimeFmt(val);
break;
case 'number' :
val = setComma(val);
break;
default:
break;
//보안모드 마스킹 항목
if(input.tagName === 'INPUT' && input.id && input.classList.contains("privacy")){
let maskVal = value.replace(/[0-9a-zA-Z]/g, "*");
document.getElementById(input.id+"$mask").value = maskVal;
}
}
}
}
});
if(e.name){
document.getElementsByName(e.name)[idx].value = val;
//보안모드 마스킹 항목
if(e.tagName === 'INPUT' && e.id && e.classList.contains("privacy")){
let maskVal = val.replace(/[0-9a-zA-Z]/g, "*");
document.getElementById(e.id+"$mask").value = maskVal;
}
}
}
}
/**
* <pre>
* [downloadImage]

Loading…
Cancel
Save