From 802338ea63251d30b3db599b127eccec0e8ed112 Mon Sep 17 00:00:00 2001
From: leebj <leebj91@xit.co.kr>
Date: Fri, 9 Aug 2024 13:40:32 +0900
Subject: [PATCH] =?UTF-8?q?=EB=B6=80=EC=84=9C=20=EC=84=A4=EC=A0=95=20?=
 =?UTF-8?q?=EA=B4=80=EB=A6=AC=20=ED=99=94=EB=A9=B4=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../WEB-INF/jsp/fims/ogdp/ogdp02010-main.jsp  |  85 ++++---
 .../WEB-INF/jsp/fims/ogdp/ogdp02020-info.jsp  | 240 +++++++++---------
 2 files changed, 161 insertions(+), 164 deletions(-)

diff --git a/src/main/webapp/WEB-INF/jsp/fims/ogdp/ogdp02010-main.jsp b/src/main/webapp/WEB-INF/jsp/fims/ogdp/ogdp02010-main.jsp
index 672042fa..cb0b3939 100644
--- a/src/main/webapp/WEB-INF/jsp/fims/ogdp/ogdp02010-main.jsp
+++ b/src/main/webapp/WEB-INF/jsp/fims/ogdp/ogdp02010-main.jsp
@@ -6,22 +6,23 @@
 		<div class="card wrapper-list">
 
 		    <div class="container-page-btn">
-		        <button type="button" id="btnReset--${pageName}" class="btn btn-outline-dark w-px-120" title="초기화">
+		        <button type="button" name="btnReset" class="btn btn-outline-dark w-px-120" title="초기화">
 		        초기화
 		        </button>
 		        <span class="container-window-btn-right">
-		            <button type="button" id="btnSearch--${pageName}" class="btn btn-search w-px-120" title="검색">
+		            <button type="button" name="btnSearch" class="btn btn-search w-px-120" title="검색">
 		            검색
 		            </button>
 		        </span>
 		    </div>
 
-		    <form id="frmSearch--${pageName}" name="frmSearch">
+		    <form name="frmSearch">
 		        <div class="container-search">
                     <div class="row g-1">
                         <div class="col-3">
-                            <label class="form-label fw-bold form-search-title" for="sggCd--${pageName}">시군구</label>
-                            <select id="sggCd--${pageName}" name="sggCd" class="form-select" disabled>
+                            <label is="name-label" for="sggCd"
+                            class="form-label fw-bold form-search-title">시군구</label>
+                            <select is="id-select" name="sggCd" class="form-select" disabled>
                             	<option value="">전체</option>
                             	<c:forEach items="${sggList}" var="item">
 	                      			<option value="${item.SGG_CD}">${item.SGG_NM}</option>
@@ -29,22 +30,26 @@
                             </select>
                         </div>
                         <div class="col-3">
-                            <label class="form-label fw-bold form-search-title" for="instNm--${pageName}">기관명</label>
-                            <input type="text" id="instNm--${pageName}" name="instNm" class="form-control" />
+                            <label is="name-label" for="instNm"
+                            class="form-label fw-bold form-search-title">기관명</label>
+                            <input type="text" is="id-input" name="instNm" class="form-control" />
                         </div>
                         <div class="col-3">
-                            <label class="form-label fw-bold form-search-title" for="instCd--${pageName}">기관코드</label>
-                            <input type="text" id="instCd--${pageName}" name="instCd" class="form-control" maxlength="7" />
+                            <label is="name-label" for="instCd"
+                            class="form-label fw-bold form-search-title">기관코드</label>
+                            <input type="text" is="id-input" name="instCd" class="form-control" maxlength="7" />
                         </div>
                     </div>
                     <div class="row g-1">
                     	<div class="col-3">
-                        	<label class="form-label fw-bold form-search-title" for="deptNm--${pageName}">부서명</label>
-                            <input type="text" id="deptNm--${pageName}" name="deptNm" class="form-control" />
+                        	<label is="name-label" for="deptNm"
+                        	class="form-label fw-bold form-search-title">부서명</label>
+                            <input type="text" is="id-input" name="deptNm" class="form-control" />
                         </div>
                         <div class="col-3">
-                        	<label class="form-label fw-bold form-search-title" for="deptCd--${pageName}">부서코드</label>
-                            <input type="text" id="deptCd--${pageName}" name="deptCd" class="form-control" maxlength="7" />
+                        	<label is="name-label" for="deptCd"
+                        	class="form-label fw-bold form-search-title">부서코드</label>
+                            <input type="text" is="id-input" name="deptCd" class="form-control" maxlength="7" />
                         </div>
                         <div class="col-6">
                         </div>
@@ -54,25 +59,21 @@
 		    </form>
 
 		    <div>
-		        <div id="gridbuttonArea--${pageName}" class="container-page-btn">
+		        <div name="gridButtonArea" class="container-page-btn">
 		            <div class="d-flex flex-row justify-content-between">
-						<span id="deptPaging--${pageName}PagingInfo" name="deptPagingInfo"
-						class="dataTables_info"></span>
-		                <ul name="deptPaging"
-		                class="pagination pagination-primary">
-		                </ul>
+						<span is="paging-info" name="deptPagingInfo" class="dataTables_info"></span>
+		                <ul name="deptPaging" class="pagination pagination-primary"></ul>
 					</div>
-					
 		        </div>
 		    </div>
 
 		    <div class="card-datatable text-nowrap">
-		        <div id="DataTables_Table_0_wrapper--${pageName}" class="dataTables_wrapper dt-bootstrap5 no-footer">
-					<div id="table-responsive--${pageName}" class="table-responsive ox-scroll oy-scroll h-px-500">
-						<table id="DataTables_Table_0--${pageName}"
+		        <div name="DataTables_Table_0_wrapper" class="dataTables_wrapper dt-bootstrap5 no-footer">
+					<div name="table-responsive" class="table-responsive ox-scroll oy-scroll h-px-500">
+						<table name="DataTables_Table_0"
 							class="table-layout-fixed datatables-ajax table table-bordered dataTable no-footer">
 							<thead class="sticky-thead">
-								<tr id="deptThead--${pageName}">
+								<tr name="deptThead">
 									<th style="width: 80px;" class="cmn">No.</th>
 									<th class="cmn" style="width: 56px;">
 										<input type="checkbox" class="form-check-input" 
@@ -88,9 +89,9 @@
 									<th class="dummy-th"></th>
 								</tr>
 							</thead>
-		                    <tbody id="deptTbody--${pageName}">
+		                    <tbody name="deptTbody">
 		                    </tbody>
-							<template id="deptRow--${pageName}">
+							<template name="deptRow">
 								<tr data-key="{DEPT_CD}">
 									<td onclick="{onclick}" ondblclick="{ondblclick}" class="text-end">{ROW_NUM}</td>
 									<td class="text-center">
@@ -107,7 +108,7 @@
 		                    		<td class="dummy-td"></td>
 	                    		</tr>
 							</template>
-							<template id="deptNotFound--${pageName}">
+							<template name="deptNotFound">
 								<tr>
 									<td valign="top" colspan="10" class="dataTables_empty text-center">
 									부서 정보를 찾지 못했습니다.
@@ -120,7 +121,7 @@
 		    </div>
 
 			<div class="toast-container position-fixed bottom-0 end-0 p-3">
-				<div id="divToast--${pageName}" class="toast" role="alert" aria-live="assertive" aria-atomic="true">
+				<div name="divToast" class="toast" role="alert" aria-live="assertive" aria-atomic="true">
 			    	<div class="toast-body bg-black text-white">
 			    	  삭제 되었습니다.
 			    	</div>
@@ -146,7 +147,7 @@ $(document).ready(function(){
 
 	var $P = pageObject["${pageName}"];
 	
-	$P.toast = new bootstrap.Toast(document.getElementById('divToast--${pageName}'), {
+	$P.toast = new bootstrap.Toast($P.find("divToast"), {
         animation: true,
         autohide: true,
         delay: 2000
@@ -184,11 +185,11 @@ $(document).ready(function(){
 	};
 
 	$P.ctrl.dataset.onCurrentChange = (dataItem) => {
-		Apply.fromDataset.currentRow($P.ctrl.dataset, dataItem, $("#deptTbody--${pageName}")[0]);
+		Apply.fromDataset.currentRow($P.ctrl.dataset, dataItem, $P.find("deptTbody"));
 	}
 	
 	$P.ctrl.dataset.onSelectionChange = (selectedArr) => {
-		Apply.fromDataset.gridCheckbox($P.ctrl.dataset, document.getElementById("deptTbody--${pageName}"), 1, selectedArr);
+		Apply.fromDataset.gridCheckbox($P.ctrl.dataset, $P.find("deptTbody"), 1, selectedArr);
 
 	};
 	
@@ -196,7 +197,7 @@ $(document).ready(function(){
 	 * pageObject.function
 	 **************************************************************************/
 	$P.fnReset = () => {
-		var searchForm = $("#frmSearch--${pageName}");
+		var searchForm = $P.$find("frmSearch");
 		searchForm.find("input[type='radio']").not("[name='taskSeCd']").prop("checked", false);
 		searchForm.find("input[type='checkbox']").prop("checked", false);
 		searchForm.find("input[type='hidden']").val("");
@@ -208,7 +209,7 @@ $(document).ready(function(){
 	}
 	
 	$P.getParams = () => {
-		var formFields = new FimsFormFields("#frmSearch--${pageName}");
+		var formFields = new FimsFormFields($P.selector("frmSearch"));
 		var data = formFields.get();
 		data.fetchSize = $P.ctrl.defaultFetchSize;
 
@@ -233,8 +234,8 @@ $(document).ready(function(){
     }
 	
 	$P.getGridTemplate = () => {
-		var notFound = [document.getElementById("deptNotFound--${pageName}").innerHTML];
-		var found = document.getElementById("deptRow--${pageName}").innerHTML;
+		var notFound = [$P.find("deptNotFound").innerHTML];
+		var found = $P.find("deptRow").innerHTML;
 		var replacer = (str, dataItem) => str
 			.replace(/{onclick}/gi, "pageObject['${pageName}'].clickDeptList('" + dataItem.getValue("DEPT_CD") + "');")
 			.replace(/{ondblclick}/gi, "pageObject['${pageName}'].dblclickDeptList('" + dataItem.getValue("DEPT_CD") + "');");
@@ -254,7 +255,7 @@ $(document).ready(function(){
 			initScroll = false;
 		}
 		
-		$("#table-responsive--${pageName}")[0].changeContent(trs, initScroll, noMore);
+		$P.find("table-responsive").changeContent(trs, initScroll, noMore);
 
 	    fn_securityModeToggle($("#securityMode--top").is(":checked")); //보안모드
 
@@ -265,7 +266,7 @@ $(document).ready(function(){
 			return;
 		}
 
-		$("#deptTbody--${pageName}").setCurrentRow(dataKey);
+		$P.$find("deptTbody").setCurrentRow(dataKey);
 
 		Apply.toDataset.current($P.ctrl.dataset, dataKey);
 	}
@@ -320,20 +321,20 @@ $(document).ready(function(){
 	/**************************************************************************
 	 * element.on
 	 **************************************************************************/
-	$('#btnReset--${pageName}').on('click', () => $P.fnReset());
-    $('#btnSearch--${pageName}').on('click', () => $P.searchDeptList());
+	$P.$find("btnReset").on('click', () => $P.fnReset());
+    $P.$find("btnSearch").on('click', () => $P.searchDeptList());
     
 	/**************************************************************************
 	 * 초기화
 	 **************************************************************************/
-	fnMakeResizableTable($("#table-responsive--${pageName}")[0]);
-	fnMakeScrollableTable($("#table-responsive--${pageName}")[0], $P.scrollDeptList);    
+	fnMakeResizableTable($P.find("table-responsive"));
+	fnMakeScrollableTable($P.find("table-responsive"), $P.scrollDeptList);    
 	
 	$P.fnReset();
     fn_securityModeToggle($("#securityMode--top").is(":checked")); //보안모드
     
 	if(MY_INFO.institute == "ADMIN00"){
-		$("#sggCd--${pageName}").removeAttr("disabled");
+		$P.$find("sggCd").removeAttr("disabled");
 	}
 });
 
diff --git a/src/main/webapp/WEB-INF/jsp/fims/ogdp/ogdp02020-info.jsp b/src/main/webapp/WEB-INF/jsp/fims/ogdp/ogdp02020-info.jsp
index f0e86917..ba3f77a0 100644
--- a/src/main/webapp/WEB-INF/jsp/fims/ogdp/ogdp02020-info.jsp
+++ b/src/main/webapp/WEB-INF/jsp/fims/ogdp/ogdp02020-info.jsp
@@ -5,28 +5,24 @@
 	<div class="container-xxl flex-grow-1 px-0">
 	
 		<div class="card">
-			<form id="frmEdit--${pageName}" name="frmEdit">
+			<form name="frmEdit">
 				
-				<div class="row g-1" id="forRootAdmin--${pageName}" hidden>
+				<div class="row g-1" name="forRootAdmin" hidden>
 					<div class="col-md-6">
-						<label for="sggID--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end required">
+						<label is="name-label" for="sggID"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end required">
 						시군구코드
 						</label>
-						
-						<input type="text" id="sggID--${pageName}" name="sggID" data-map="SGG_CD"
-						class="form-control" required maxlength="7" readonly />
-						
+						<input type="text" is="id-input" name="sggID" data-map="SGG_CD"
+						class="form-control w-px-200" required maxlength="7" readonly />
 					</div>
 					<div class="col-md-6">
-						<label for="instCode--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end required">
+						<label is="name-label" for="instCode"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end required">
 						기관코드
 						</label>
-						
-						<input type="text" id="instCode--${pageName}" name="instCode" data-map="INST_CD"
-						class="form-control" required maxlength="7" readonly />
-						
+						<input type="text" is="id-input" name="instCode" data-map="INST_CD"
+						class="form-control w-px-200" required maxlength="7" readonly />
 					</div>
 				</div>
 					
@@ -35,219 +31,219 @@
 				<div class="row g-1">
 					
 					<div class="col-md-6">
-						<label for="deptID--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end required">
+						<label is="name-label" for="deptID"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end required">
 						부서코드
 						</label>
 						
-						<input type="text" id="deptID--${pageName}" name="deptID" data-map="DEPT_CD"
-						class="form-control" required maxlength="7" readonly />
+						<input type="text" is="id-input" name="deptID" data-map="DEPT_CD"
+						class="form-control w-px-200" required maxlength="7" readonly />
 						
 					</div>
 					
 					<div class="col-md-6">
-						<label for="name--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end required">
+						<label is="name-label" for="name"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end required">
 						부서명
 						</label>
 						
-						<input type="text" id="name--${pageName}" name="name" data-map="DEPT_NM"
-						class="form-control" required readonly  />
+						<input type="text" is="id-input" name="name" data-map="DEPT_NM"
+						class="form-control w-px-200" required readonly  />
 						
 					</div>
 					
 					<div class="col-md-12" hidden>
-						<input type="text" id="telno--${pageName}" name="telno" data-map="DEPT_TELNO"
-						class="form-control" />
-						<input type="text" id="faxno--${pageName}" name="faxno" data-map="DEPT_FXNO"
-						class="form-control" />
+						<input type="text" is="id-input" name="telno" data-map="DEPT_TELNO"
+						class="form-control w-px-200" />
+						<input type="text" is="id-input" name="faxno" data-map="DEPT_FXNO"
+						class="form-control w-px-200" />
 					</div>
 					
 				</div>
 				
 				<div class="row g-1">
 					<div class="col-md-6">
-						<label for="cvlcptLinkSeCd--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="cvlcptLinkSeCd"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						민원연계구분
 						</label>
-						<input type="text" id="cvlcptLinkSeCd--${pageName}" name="cvlcptLinkSeCd" data-map="CVLCPT_LINK_SE_CD" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="cvlcptLinkSeCd" data-map="CVLCPT_LINK_SE_CD" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="vrbacntLinkSeCd--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="vrbacntLinkSeCd"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						가상계좌연계구분
 						</label>
-						<input type="text" id="vrbacntLinkSeCd--${pageName}" name="vrbacntLinkSeCd" data-map="VRBACNT_LINK_SE_CD" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="vrbacntLinkSeCd" data-map="VRBACNT_LINK_SE_CD" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="pstofcNm--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="pstofcNm"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						우체국명
 						</label>
-						<input type="text" id="pstofcNm--${pageName}" name="pstofcNm" data-map="PSTOFC_NM" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="pstofcNm" data-map="PSTOFC_NM" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="rgNoHeader--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="rgNoHeader"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						등기번호 헤더
 						</label>
-						<input type="text" id="rgNoHeader--${pageName}" name="rgNoHeader" data-map="RG_NO_HEADER" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="rgNoHeader" data-map="RG_NO_HEADER" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="sndngLinkSeCd--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="sndngLinkSeCd"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						발송연계구분
 						</label>
-						<input type="text" id="sndngLinkSeCd--${pageName}" name="sndngLinkSeCd" data-map="SNDNG_LINK_SE_CD" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="sndngLinkSeCd" data-map="SNDNG_LINK_SE_CD" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="egpConOrg--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="egpConOrg"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						E그린 외부기관구분
 						</label>
-						<input type="text" id="egpConOrg--${pageName}" name="egpConOrg" data-map="EGP_CON_ORG" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="egpConOrg" data-map="EGP_CON_ORG" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="egpRceptId--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="egpRceptId"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						E그린 접수수체국기호
 						</label>
-						<input type="text" id="egpRceptId--${pageName}" name="egpRceptId" data-map="EGP_RCEPT_ID" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="egpRceptId" data-map="EGP_RCEPT_ID" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="egpApvlNb--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="egpApvlNb"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						E그린 후납계약승인번호
 						</label>
-						<input type="text" id="egpApvlNb--${pageName}" name="egpApvlNb" data-map="EGP_APVL_NB" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="egpApvlNb" data-map="EGP_APVL_NB" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="egpEsbPath--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="egpEsbPath"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						E그린 ESB경로
 						</label>
-						<input type="text" id="egpEsbPath--${pageName}" name="egpEsbPath" data-map="EGP_ESB_PATH" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="egpEsbPath" data-map="EGP_ESB_PATH" 
+						class="form-control w-px-300"  />
 					</div>
 					<div class="col-md-6">
-						<label for="egpPostInstId--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="egpPostInstId"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						E그린 우정정보센터 기관ID
 						</label>
-						<input type="text" id="egpPostInstId--${pageName}" name="egpPostInstId" data-map="EGP_POST_INST_ID" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="egpPostInstId" data-map="EGP_POST_INST_ID" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="egpCertCn--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="egpCertCn"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						E그린 인증서CN
 						</label>
-						<input type="text" id="egpCertCn--${pageName}" name="egpCertCn" data-map="EGP_CERT_CN" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="egpCertCn" data-map="EGP_CERT_CN" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="ensInterfaceId--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="ensInterfaceId"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						세외수입인터페이스ID
 						</label>
-						<input type="text" id="ensInterfaceId--${pageName}" name="ensInterfaceId" data-map="ENS_INTERFACE_ID" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="ensInterfaceId" data-map="ENS_INTERFACE_ID" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="ensSourceCd--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="ensSourceCd"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						세외수입소스코드
 						</label>
-						<input type="text" id="ensSourceCd--${pageName}" name="ensSourceCd" data-map="ENS_SOURCE_CD" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="ensSourceCd" data-map="ENS_SOURCE_CD" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="ensTargetCd--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="ensTargetCd"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						세외수입타겟코드
 						</label>
-						<input type="text" id="ensTargetCd--${pageName}" name="ensTargetCd" data-map="ENS_TARGET_CD" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="ensTargetCd" data-map="ENS_TARGET_CD" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="ensUrl--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="ensUrl"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						세외수입URL
 						</label>
-						<input type="text" id="ensUrl--${pageName}" name="ensUrl" data-map="ENS_URL" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="ensUrl" data-map="ENS_URL" 
+						class="form-control w-px-300"  />
 					</div>
 					<div class="col-md-6">
-						<label for="nxrpLinkYn--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="nxrpLinkYn"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						세외수입 연계 여부
 						</label>
-						<input type="text" id="nxrpLinkYn--${pageName}" name="nxrpLinkYn" data-map="NXRP_LINK_YN" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="nxrpLinkYn" data-map="NXRP_LINK_YN" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="nxrpLinkSrvcUrl--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="nxrpLinkSrvcUrl"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						세외수입연계서비스URL
 						</label>
-						<input type="text" id="nxrpLinkSrvcUrl--${pageName}" name="nxrpLinkSrvcUrl" data-map="NXRP_LINK_SRVC_URL" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="nxrpLinkSrvcUrl" data-map="NXRP_LINK_SRVC_URL" 
+						class="form-control w-px-300"  />
 					</div>
 					<div class="col-md-6">
-						<label for="nxrpRgnSeCd--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="nxrpRgnSeCd"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						세외수입지역구분코드
 						</label>
-						<input type="text" id="nxrpRgnSeCd--${pageName}" name="nxrpRgnSeCd" data-map="NXRP_RGN_SE_CD" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="nxrpRgnSeCd" data-map="NXRP_RGN_SE_CD" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="dtbnBankNm--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="dtbnBankNm"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						교부은행명
 						</label>
-						<input type="text" id="dtbnBankNm--${pageName}" name="dtbnBankNm" data-map="DTBN_BANK_NM" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="dtbnBankNm" data-map="DTBN_BANK_NM" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="dtbnActno--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="dtbnActno"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						교부계좌번호
 						</label>
-						<input type="text" id="dtbnActno--${pageName}" name="dtbnActno" data-map="DTBN_ACTNO" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="dtbnActno" data-map="DTBN_ACTNO" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="docHeader--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="docHeader"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						문서머릿말
 						</label>
-						<input type="text" id="docHeader--${pageName}" name="docHeader" data-map="DOC_HEADER" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="docHeader" data-map="DOC_HEADER" 
+						class="form-control w-px-200"  />
 					</div>
 					<div class="col-md-6">
-						<label for="srvrOs--${pageName}"
-						class="w-px-120 bg-lighter pe-2 col-form-label text-sm-end">
+						<label is="name-label" for="srvrOs"
+						class="w-px-160 bg-lighter pe-2 col-form-label text-sm-end">
 						서버OS
 						</label>
-						<input type="text" id="srvrOs--${pageName}" name="srvrOs" data-map="SRVR_OS" 
-						class="form-control"  />
+						<input type="text" is="id-input" name="srvrOs" data-map="SRVR_OS" 
+						class="form-control w-px-200"  />
 					</div>
 				</div>
 
 				<div class="row m-3">
 					<div class="col-md-12">
 						<span class="float-end">
-							<button type="button" id="btnSave--${pageName}" class="btn btn-primary">저장</button>
+							<button type="button" name="btnSave" class="btn btn-primary">저장</button>
 						</span>
 					</div>
 				</div>
@@ -281,7 +277,7 @@ $(document).ready(function(){
 	/**************************************************************************
 	 * DatasetControl, Dataset, FormFields
 	 **************************************************************************/
-	$P.formFields = new FimsFormFields("#frmEdit--${pageName}");
+	$P.formFields = new FimsFormFields($P.selector("frmEdit"));
 
 	$P.ctrl = new DatasetControl({
 	    dataGetter : obj => obj["List"], appendData : true,
@@ -309,7 +305,7 @@ $(document).ready(function(){
 	 **************************************************************************/
 	$P.fnSave = () => {
 
-		if(!customValidate($("#frmEdit--${pageName} input"))) return;
+		if(!customValidate($P.$find("frmEdit").find("input"))) return;
 		
 		var info = $P.formFields.get();
 		if(info.deptID.length != 7){
@@ -337,7 +333,7 @@ $(document).ready(function(){
 	/**************************************************************************
 	 * element.on
 	 **************************************************************************/
-	$("#btnSave--${pageName}").on('click', () => $P.fnSave());
+	 $P.$find("btnSave").on('click', () => $P.fnSave());
 	
 	
 	/**************************************************************************
@@ -345,15 +341,15 @@ $(document).ready(function(){
 	 **************************************************************************/
 	
 	if(MY_INFO.institute == 'ADMIN00') {
-		$("#forRootAdmin--${pageName}").removeAttr("hidden");
+		$P.$find("forRootAdmin").removeAttr("hidden");
 	}
 	
 	var deptInfo = ${deptInfo};
-	$("#deptID--${pageName}").attr("disabled","disabled");
-	$("#name--${pageName}").attr("disabled","disabled");
+	$P.$find("deptID").attr("disabled","disabled");
+	$P.$find("name").attr("disabled","disabled");
 	$P.ctrl.dataset.setData([deptInfo]);
 	if(deptInfo.USE_YN == "N"){
-		$("#btnSave--${pageName}").attr("disabled","disabled");
+		$P.$find("btnSave").attr("disabled","disabled");
 	}
 	
 });