ninegrid2 6.245.0 → 6.247.0

package/dist/bundle.cjs.js

@@ -18053,26 +18053,6 @@ class ngFilterPanel extends HTMLElement
 		this.classList.add("loading");
 		
 		setTimeout(() => {
-
-			/**
-			const LVL_IDX	= grd.fields.indexOf("LVL");
-			const CHK_IDX	= grd.fields.indexOf("CHK");
-			const COLNM_IDX	= grd.fields.indexOf("COLNM");
-			const DATA_IDX	= grd.fields.indexOf("DATA");
-			
-			const checked	= grd.data.getValidDataNF().filter(m => { return m.v[LVL_IDX] == 2 && m.v[CHK_IDX] == "Y"; });
-			//const unchecked = grd.data.getValidDataNF().filter(m => { return m.v[LVL_IDX] == 2 && m.v[CHK_IDX] != "Y"; });
-			
-			var filterOptions = [];
-			if (checked.length > 0) {
-				
-				[...new Set(checked.map(m => { return m.v[COLNM_IDX] }))].forEach(v => {
-					filterOptions.push({
-						colnm	: v,
-						data	: [...new Set(grd.data.getValidData().filter(m => { return m.v[CHK_IDX] == "Y" && m.v[COLNM_IDX] == v; }).map(m => { return m.v[DATA_IDX] || ''; }))].sort((a,b) => { return a > b ? 1 : -1; }),
-					});
-				});
-			} */
 			const [LVL_IDX, CHK_IDX, COLNM_IDX, DATA_IDX] = ["LVL", "CHK", "COLNM", "DATA"].map(k => grd.fields.indexOf(k));
 			const checked = grd.data.getValidDataNF().filter(m => m.v[LVL_IDX] === 2 && m.v[CHK_IDX] === "Y");
 			const filterOptions = checked.length > 0 ? [...new Set(checked.map(m => m.v[COLNM_IDX]))].map(v => ({
@@ -18082,18 +18062,6 @@ class ngFilterPanel extends HTMLElement
 			
 			
 			this.#button.filterOptions = filterOptions;
-			
-			/**
-			var oParam = {};
-			
-			this.#owner.body.querySelectorAll("ng-filter-button").forEach(el => {
-				
-				//if (!el.filterOptions) return true;
-
-				el.filterOptions.forEach(filterOptions => {
-					if (filterOptions.data.length > 0) oParam[filterOptions.colnm] = filterOptions.data;
-				});
-			}); */
 
 			const oParam = Object.fromEntries(
 				[...this.#owner.body.querySelectorAll("ng-filter-button")]
@@ -18103,60 +18071,53 @@ class ngFilterPanel extends HTMLElement
 			);
 			
 			this.#owner.filtering.set(oParam);
+
 			this.classList.remove("loading");
+			this.style.display = 'none';
 		});
-		
-		//$(this).hide();
-		this.style.display = 'none';
 	};
 	
 	
 	
 	#onCancel = (e) => {
-		//$(this).hide();
 		this.style.display = 'none';
 	};
 
 	#onSelectAll = (e) => {
-		var grd = this.shadowRoot.querySelector("nine-grid");
-		var idx = (grd.fields.indexOf("CHK"));
+		const grd = this.shadowRoot.querySelector("nine-grid");
+		const idx = grd.fields.indexOf("CHK");
+		const isChecked = e.target.checked; // ✅ jQuery 없이 `checked` 값 가져오기
+
+		grd.data.getValidData().forEach(m => {
+			m.v[idx] = isChecked ? "Y" : "N"; // ✅ `Y` 또는 `N` 값 설정
+		});
 
-		grd.data.getValidData().map(m => { m.v[idx] = $(e.target).prop("checked") ? "Y" : "N"; });
-		
 		grd.refreshData();
 	};
+
 	
 	
 	#onInput = (e) => {
-		var grd = this.shadowRoot.querySelector("nine-grid");
-
+		const grd = this.shadowRoot.querySelector("nine-grid");
 		
-		ninegrid.j.querySelectorAll(grd).addClass("loading");
-
+		grd.classList.add("loading");
 		
-		var data = grd.dataManager.rawRecords;
+		const data = grd.dataManager.rawRecords;
+    	data.forEach(m => { m.__ng.filtered = false; });
 		
-		data.map(m => { m.__ng.filtered = false; });
+		const v = e.target.value.toLowerCase(); // ✅ jQuery 없이 값 가져오기
+		const [LVL_IDX, DATA_IDX] = ["LVL", "DATA"].map(field => grd.fields.indexOf(field));
 
-		
-		var v = $(e.target).val().toLowerCase();
-		
+		data.forEach(m => {
+			m.__ng.filtered = m.v[LVL_IDX] === 2 && !String(m.v[DATA_IDX] || "").toLowerCase().includes(v);
+		});
 
-		const LVL_IDX	= grd.fields.indexOf("LVL");
-		const DATA_IDX	= grd.fields.indexOf("DATA");
-		
-		data.filter(m => { return m.v[LVL_IDX] == 2 && String(m.v[DATA_IDX] || '').toLowerCase().indexOf(v) < 0; }).map(m => { m.__ng.filtered = true; });
-		
 		grd.data.resetRecords();
 		
-		if (this.#timer) {
-			clearTimeout(this.#timer);
-			this.#timer = null;
-		}
+		clearTimeout(this.#timer);
 		this.#timer = setTimeout(() => {
 			grd.dataManager.viewRecords.reset();
 			grd.dataManager.viewRecords.touch();
-			//ninegrid.j.querySelectorAll(grd).removeClass("loading");
 		}, 200);
 	};
 	
@@ -18167,108 +18128,68 @@ class ngFilterPanel extends HTMLElement
 
 	open = (filterButton) => {
 
-		//const owner = this.shadow.closest("nine-grid");
-
 		/** 위치 */
 		const cell = filterButton.closest("th,td");
 
-		const filterButtonRect = filterButton.getBoundingClientRect();
-		const ownerRect = this.#owner.getBoundingClientRect();
-		const cellRect = cell.getBoundingClientRect();
-		const targetRect = this.getBoundingClientRect();
-
-		let l = filterButtonRect.left - ownerRect.left;
-		if (l < 0) l = 0;
-		if (l + targetRect.width > ownerRect.width) l = ownerRect.width - targetRect.width - 5;
-
-		const t = cellRect.top + cellRect.height - ownerRect.top;
+		const { left: btnLeft } = filterButton.getBoundingClientRect();
+		const { left: ownerLeft, width: ownerWidth, top: ownerTop } = this.#owner.getBoundingClientRect();
+		const { top: cellTop, height: cellHeight } = cell.getBoundingClientRect();
+		const { width: targetWidth } = this.getBoundingClientRect();
 
-		this.style.left = `${l}px`; // ✅ 위치 설정
-		this.style.top = `${t}px`;
+		let l = Math.max(0, btnLeft - ownerLeft);
+		l = Math.min(l, ownerWidth - targetWidth - 5);
 
-		
-
-		//console.log(this, owner, filterButton.filterOptions, colnms);
-		
-		var col = filterButton.closest('th,td').dataset.col;
-		this.col = col;
+		const t = cellTop + cellHeight - ownerTop;
 
-		this.#button = filterButton;
-		
-		this.style.display = 'flex';
+		Object.assign(this.style, { left: `${l}px`, top: `${t}px`, display: "flex" });
 		this.classList.add("loading");
 
-		
 		this.shadowRoot.querySelector("input[type=text]").value = "";
 
-
-		//$(this.shadowRoot).find("input[type=text]").val("");
-
 		setTimeout(() => {
-
+			const data = this.#owner.data.getValidDataNF();
+			const col = cell.dataset.col;
+			this.col = col;
+			this.#button = filterButton;
 			
-			let data = this.#owner.data.getValidDataNF();
-			
-			var ds = [];
-			filterButton.filterOptions.forEach((filterOption,i) => {
-
-				ds.push({
-					LVL: 1,
-					CHK: 'N',
-					DATA2: '<span class="group">' + $(filterButton).closest('th,td').text() + (filterButton.filterOptions.length > 1 ? ` #${i+1} (${filterOption.colnm})` : '') + '</span>',
-				});
+			const ds = filterButton.filterOptions.map((filterOption, i) => {
+				const groupLabel = `<span class="group">${cell.textContent}${filterButton.filterOptions.length > 1 ? ` #${i + 1} (${filterOption.colnm})` : ""}</span>`;
 
-				/**
-				var cell = $(`[data-col=${col}][data-bind=${filterOption.colnm}]`, this.#owner.template);
-				var expr = cell.attr("data-expr");
-				var exprFunc = (expr) ? this.#owner.exprFunction(expr) : null;
-				*/
-				
-				const cell = ninegrid.j.querySelectorAll(`[data-col="${col}"][data-bind="${filterOption.colnm}"]`, this.#owner.tmpl).elem();
-				const expr = cell.getAttribute("data-expr");
-				const exprFunc = (expr) ? this.#owner.exprFunction(expr) : null;
+				const cellEl = this.#owner.tmpl.querySelector(`[data-col="${col}"][data-bind="${filterOption.colnm}"]`);
+				const expr = cellEl?.getAttribute("data-expr");
+				const exprFunc = expr ? this.#owner.exprFunction(expr) : null;
 
-				var data2 = [];
-				for (var rowData of data) {
-					var idx = this.#owner.fields.indexOf(filterOption.colnm);
-					
-					if (expr) {
-						var o = this.#owner.data.conv(rowData);
-						data2.push({v:o[filterOption.colnm],v2:exprFunc(o, rowData.__ng.rowidx, this.#owner.data)});
-					}
-					else {
-						data2.push({v:rowData.v[idx],v2:rowData.v[idx]});
-					}
-				}
-
-				console.log(data, data2);
-
-				[...new Set(data2.sort( (a,b) => { return (a.v2||'') > (b.v2||'') ? 1 : ((a.v2||'') < (b.v2||'') ? -1 : 0); } ).map((m) => JSON.stringify(m)))].map((m) => JSON.parse(m)).forEach(o => {
-					console.log(filterOption, o);
-					ds.push({
-						LVL		: 2,
-						DATA	: o.v,
-						DATA2	: o.v2 || ` <span class="empty">(empty)</span> ${o.v}`,
-						COLNM	: filterOption.colnm,
-						CHK		: filterOption.data.length == 0 || filterOption.data.nineBinarySearch(o.v || '') >= 0 ? "Y" : "N",
-					});
+				const data2 = data.map(rowData => {
+					const idx = this.#owner.fields.indexOf(filterOption.colnm);
+					return expr ? { v: rowData.v[idx], v2: exprFunc(this.#owner.data.conv(rowData), rowData.__ng.rowidx, this.#owner.data) } : { v: rowData.v[idx], v2: rowData.v[idx] };
 				});
-			});
+
+				return [
+					{ LVL: 1, CHK: "N", DATA2: groupLabel },
+					...[...new Set(data2.map(JSON.stringify))]
+						.map(JSON.parse)
+						.sort((a, b) => (a.v2 || "") > (b.v2 || "") ? 1 : (a.v2 || "") < (b.v2 || "") ? -1 : 0)
+						.map(o => ({
+							LVL: 2,
+							DATA: o.v,
+							DATA2: o.v2 || ` <span class="empty">(empty)</span> ${o.v}`,
+							COLNM: filterOption.colnm,
+							CHK: filterOption.data.length === 0 || filterOption.data.nineBinarySearch(o.v || "") >= 0 ? "Y" : "N",
+						}))
+				];
+			}).flat();
 			
 			const grd = this.shadowRoot.querySelector("nine-grid");
 			//grd.dataSource = ds;
 			grd.fields.add(["DATA","DATA2","COLNM"]);
-			
 			grd.data.set(ds);
 			
 			// ✅ 데이터 필터링 및 체크 상태 결정
 			const checkbox = this.shadowRoot.querySelector("input[type=checkbox]");
-			checkbox.checked = grd.data.getValidData().filter(item => item.LVL == 2 && item.CHK != "Y").length === 0; // ✅ 체크 상태 설정
+			checkbox.checked = grd.data.getValidData().every(item => !(item.LVL === 2 && item.CHK !== "Y"));
 
 			this.shadowRoot.querySelector("input").focus();
-			
 			this.classList.remove("loading");
-			//ninegrid.j.querySelectorAll(this).removeClass("loading");
 		});
 	};
 }

package/dist/bundle.esm.js

@@ -18051,26 +18051,6 @@ class ngFilterPanel extends HTMLElement
 		this.classList.add("loading");
 		
 		setTimeout(() => {
-
-			/**
-			const LVL_IDX	= grd.fields.indexOf("LVL");
-			const CHK_IDX	= grd.fields.indexOf("CHK");
-			const COLNM_IDX	= grd.fields.indexOf("COLNM");
-			const DATA_IDX	= grd.fields.indexOf("DATA");
-			
-			const checked	= grd.data.getValidDataNF().filter(m => { return m.v[LVL_IDX] == 2 && m.v[CHK_IDX] == "Y"; });
-			//const unchecked = grd.data.getValidDataNF().filter(m => { return m.v[LVL_IDX] == 2 && m.v[CHK_IDX] != "Y"; });
-			
-			var filterOptions = [];
-			if (checked.length > 0) {
-				
-				[...new Set(checked.map(m => { return m.v[COLNM_IDX] }))].forEach(v => {
-					filterOptions.push({
-						colnm	: v,
-						data	: [...new Set(grd.data.getValidData().filter(m => { return m.v[CHK_IDX] == "Y" && m.v[COLNM_IDX] == v; }).map(m => { return m.v[DATA_IDX] || ''; }))].sort((a,b) => { return a > b ? 1 : -1; }),
-					});
-				});
-			} */
 			const [LVL_IDX, CHK_IDX, COLNM_IDX, DATA_IDX] = ["LVL", "CHK", "COLNM", "DATA"].map(k => grd.fields.indexOf(k));
 			const checked = grd.data.getValidDataNF().filter(m => m.v[LVL_IDX] === 2 && m.v[CHK_IDX] === "Y");
 			const filterOptions = checked.length > 0 ? [...new Set(checked.map(m => m.v[COLNM_IDX]))].map(v => ({
@@ -18080,18 +18060,6 @@ class ngFilterPanel extends HTMLElement
 			
 			
 			this.#button.filterOptions = filterOptions;
-			
-			/**
-			var oParam = {};
-			
-			this.#owner.body.querySelectorAll("ng-filter-button").forEach(el => {
-				
-				//if (!el.filterOptions) return true;
-
-				el.filterOptions.forEach(filterOptions => {
-					if (filterOptions.data.length > 0) oParam[filterOptions.colnm] = filterOptions.data;
-				});
-			}); */
 
 			const oParam = Object.fromEntries(
 				[...this.#owner.body.querySelectorAll("ng-filter-button")]
@@ -18101,60 +18069,53 @@ class ngFilterPanel extends HTMLElement
 			);
 			
 			this.#owner.filtering.set(oParam);
+
 			this.classList.remove("loading");
+			this.style.display = 'none';
 		});
-		
-		//$(this).hide();
-		this.style.display = 'none';
 	};
 	
 	
 	
 	#onCancel = (e) => {
-		//$(this).hide();
 		this.style.display = 'none';
 	};
 
 	#onSelectAll = (e) => {
-		var grd = this.shadowRoot.querySelector("nine-grid");
-		var idx = (grd.fields.indexOf("CHK"));
+		const grd = this.shadowRoot.querySelector("nine-grid");
+		const idx = grd.fields.indexOf("CHK");
+		const isChecked = e.target.checked; // ✅ jQuery 없이 `checked` 값 가져오기
+
+		grd.data.getValidData().forEach(m => {
+			m.v[idx] = isChecked ? "Y" : "N"; // ✅ `Y` 또는 `N` 값 설정
+		});
 
-		grd.data.getValidData().map(m => { m.v[idx] = $(e.target).prop("checked") ? "Y" : "N"; });
-		
 		grd.refreshData();
 	};
+
 	
 	
 	#onInput = (e) => {
-		var grd = this.shadowRoot.querySelector("nine-grid");
-
+		const grd = this.shadowRoot.querySelector("nine-grid");
 		
-		ninegrid.j.querySelectorAll(grd).addClass("loading");
-
+		grd.classList.add("loading");
 		
-		var data = grd.dataManager.rawRecords;
+		const data = grd.dataManager.rawRecords;
+    	data.forEach(m => { m.__ng.filtered = false; });
 		
-		data.map(m => { m.__ng.filtered = false; });
+		const v = e.target.value.toLowerCase(); // ✅ jQuery 없이 값 가져오기
+		const [LVL_IDX, DATA_IDX] = ["LVL", "DATA"].map(field => grd.fields.indexOf(field));
 
-		
-		var v = $(e.target).val().toLowerCase();
-		
+		data.forEach(m => {
+			m.__ng.filtered = m.v[LVL_IDX] === 2 && !String(m.v[DATA_IDX] || "").toLowerCase().includes(v);
+		});
 
-		const LVL_IDX	= grd.fields.indexOf("LVL");
-		const DATA_IDX	= grd.fields.indexOf("DATA");
-		
-		data.filter(m => { return m.v[LVL_IDX] == 2 && String(m.v[DATA_IDX] || '').toLowerCase().indexOf(v) < 0; }).map(m => { m.__ng.filtered = true; });
-		
 		grd.data.resetRecords();
 		
-		if (this.#timer) {
-			clearTimeout(this.#timer);
-			this.#timer = null;
-		}
+		clearTimeout(this.#timer);
 		this.#timer = setTimeout(() => {
 			grd.dataManager.viewRecords.reset();
 			grd.dataManager.viewRecords.touch();
-			//ninegrid.j.querySelectorAll(grd).removeClass("loading");
 		}, 200);
 	};
 	
@@ -18165,108 +18126,68 @@ class ngFilterPanel extends HTMLElement
 
 	open = (filterButton) => {
 
-		//const owner = this.shadow.closest("nine-grid");
-
 		/** 위치 */
 		const cell = filterButton.closest("th,td");
 
-		const filterButtonRect = filterButton.getBoundingClientRect();
-		const ownerRect = this.#owner.getBoundingClientRect();
-		const cellRect = cell.getBoundingClientRect();
-		const targetRect = this.getBoundingClientRect();
-
-		let l = filterButtonRect.left - ownerRect.left;
-		if (l < 0) l = 0;
-		if (l + targetRect.width > ownerRect.width) l = ownerRect.width - targetRect.width - 5;
-
-		const t = cellRect.top + cellRect.height - ownerRect.top;
+		const { left: btnLeft } = filterButton.getBoundingClientRect();
+		const { left: ownerLeft, width: ownerWidth, top: ownerTop } = this.#owner.getBoundingClientRect();
+		const { top: cellTop, height: cellHeight } = cell.getBoundingClientRect();
+		const { width: targetWidth } = this.getBoundingClientRect();
 
-		this.style.left = `${l}px`; // ✅ 위치 설정
-		this.style.top = `${t}px`;
+		let l = Math.max(0, btnLeft - ownerLeft);
+		l = Math.min(l, ownerWidth - targetWidth - 5);
 
-		
-
-		//console.log(this, owner, filterButton.filterOptions, colnms);
-		
-		var col = filterButton.closest('th,td').dataset.col;
-		this.col = col;
+		const t = cellTop + cellHeight - ownerTop;
 
-		this.#button = filterButton;
-		
-		this.style.display = 'flex';
+		Object.assign(this.style, { left: `${l}px`, top: `${t}px`, display: "flex" });
 		this.classList.add("loading");
 
-		
 		this.shadowRoot.querySelector("input[type=text]").value = "";
 
-
-		//$(this.shadowRoot).find("input[type=text]").val("");
-
 		setTimeout(() => {
-
+			const data = this.#owner.data.getValidDataNF();
+			const col = cell.dataset.col;
+			this.col = col;
+			this.#button = filterButton;
 			
-			let data = this.#owner.data.getValidDataNF();
-			
-			var ds = [];
-			filterButton.filterOptions.forEach((filterOption,i) => {
-
-				ds.push({
-					LVL: 1,
-					CHK: 'N',
-					DATA2: '<span class="group">' + $(filterButton).closest('th,td').text() + (filterButton.filterOptions.length > 1 ? ` #${i+1} (${filterOption.colnm})` : '') + '</span>',
-				});
+			const ds = filterButton.filterOptions.map((filterOption, i) => {
+				const groupLabel = `<span class="group">${cell.textContent}${filterButton.filterOptions.length > 1 ? ` #${i + 1} (${filterOption.colnm})` : ""}</span>`;
 
-				/**
-				var cell = $(`[data-col=${col}][data-bind=${filterOption.colnm}]`, this.#owner.template);
-				var expr = cell.attr("data-expr");
-				var exprFunc = (expr) ? this.#owner.exprFunction(expr) : null;
-				*/
-				
-				const cell = ninegrid.j.querySelectorAll(`[data-col="${col}"][data-bind="${filterOption.colnm}"]`, this.#owner.tmpl).elem();
-				const expr = cell.getAttribute("data-expr");
-				const exprFunc = (expr) ? this.#owner.exprFunction(expr) : null;
+				const cellEl = this.#owner.tmpl.querySelector(`[data-col="${col}"][data-bind="${filterOption.colnm}"]`);
+				const expr = cellEl?.getAttribute("data-expr");
+				const exprFunc = expr ? this.#owner.exprFunction(expr) : null;
 
-				var data2 = [];
-				for (var rowData of data) {
-					var idx = this.#owner.fields.indexOf(filterOption.colnm);
-					
-					if (expr) {
-						var o = this.#owner.data.conv(rowData);
-						data2.push({v:o[filterOption.colnm],v2:exprFunc(o, rowData.__ng.rowidx, this.#owner.data)});
-					}
-					else {
-						data2.push({v:rowData.v[idx],v2:rowData.v[idx]});
-					}
-				}
-
-				console.log(data, data2);
-
-				[...new Set(data2.sort( (a,b) => { return (a.v2||'') > (b.v2||'') ? 1 : ((a.v2||'') < (b.v2||'') ? -1 : 0); } ).map((m) => JSON.stringify(m)))].map((m) => JSON.parse(m)).forEach(o => {
-					console.log(filterOption, o);
-					ds.push({
-						LVL		: 2,
-						DATA	: o.v,
-						DATA2	: o.v2 || ` <span class="empty">(empty)</span> ${o.v}`,
-						COLNM	: filterOption.colnm,
-						CHK		: filterOption.data.length == 0 || filterOption.data.nineBinarySearch(o.v || '') >= 0 ? "Y" : "N",
-					});
+				const data2 = data.map(rowData => {
+					const idx = this.#owner.fields.indexOf(filterOption.colnm);
+					return expr ? { v: rowData.v[idx], v2: exprFunc(this.#owner.data.conv(rowData), rowData.__ng.rowidx, this.#owner.data) } : { v: rowData.v[idx], v2: rowData.v[idx] };
 				});
-			});
+
+				return [
+					{ LVL: 1, CHK: "N", DATA2: groupLabel },
+					...[...new Set(data2.map(JSON.stringify))]
+						.map(JSON.parse)
+						.sort((a, b) => (a.v2 || "") > (b.v2 || "") ? 1 : (a.v2 || "") < (b.v2 || "") ? -1 : 0)
+						.map(o => ({
+							LVL: 2,
+							DATA: o.v,
+							DATA2: o.v2 || ` <span class="empty">(empty)</span> ${o.v}`,
+							COLNM: filterOption.colnm,
+							CHK: filterOption.data.length === 0 || filterOption.data.nineBinarySearch(o.v || "") >= 0 ? "Y" : "N",
+						}))
+				];
+			}).flat();
 			
 			const grd = this.shadowRoot.querySelector("nine-grid");
 			//grd.dataSource = ds;
 			grd.fields.add(["DATA","DATA2","COLNM"]);
-			
 			grd.data.set(ds);
 			
 			// ✅ 데이터 필터링 및 체크 상태 결정
 			const checkbox = this.shadowRoot.querySelector("input[type=checkbox]");
-			checkbox.checked = grd.data.getValidData().filter(item => item.LVL == 2 && item.CHK != "Y").length === 0; // ✅ 체크 상태 설정
+			checkbox.checked = grd.data.getValidData().every(item => !(item.LVL === 2 && item.CHK !== "Y"));
 
 			this.shadowRoot.querySelector("input").focus();
-			
 			this.classList.remove("loading");
-			//ninegrid.j.querySelectorAll(this).removeClass("loading");
 		});
 	};
 }

package/dist/etc/ngFiltering.js

@@ -230,26 +230,6 @@ class ngFilterPanel extends HTMLElement
 		this.classList.add("loading");
 		
 		setTimeout(() => {
-
-			/**
-			const LVL_IDX	= grd.fields.indexOf("LVL");
-			const CHK_IDX	= grd.fields.indexOf("CHK");
-			const COLNM_IDX	= grd.fields.indexOf("COLNM");
-			const DATA_IDX	= grd.fields.indexOf("DATA");
-			
-			const checked	= grd.data.getValidDataNF().filter(m => { return m.v[LVL_IDX] == 2 && m.v[CHK_IDX] == "Y"; });
-			//const unchecked = grd.data.getValidDataNF().filter(m => { return m.v[LVL_IDX] == 2 && m.v[CHK_IDX] != "Y"; });
-			
-			var filterOptions = [];
-			if (checked.length > 0) {
-				
-				[...new Set(checked.map(m => { return m.v[COLNM_IDX] }))].forEach(v => {
-					filterOptions.push({
-						colnm	: v,
-						data	: [...new Set(grd.data.getValidData().filter(m => { return m.v[CHK_IDX] == "Y" && m.v[COLNM_IDX] == v; }).map(m => { return m.v[DATA_IDX] || ''; }))].sort((a,b) => { return a > b ? 1 : -1; }),
-					});
-				});
-			} */
 			const [LVL_IDX, CHK_IDX, COLNM_IDX, DATA_IDX] = ["LVL", "CHK", "COLNM", "DATA"].map(k => grd.fields.indexOf(k));
 			const checked = grd.data.getValidDataNF().filter(m => m.v[LVL_IDX] === 2 && m.v[CHK_IDX] === "Y");
 			const filterOptions = checked.length > 0 ? [...new Set(checked.map(m => m.v[COLNM_IDX]))].map(v => ({
@@ -259,18 +239,6 @@ class ngFilterPanel extends HTMLElement
 			
 			
 			this.#button.filterOptions = filterOptions;
-			
-			/**
-			var oParam = {};
-			
-			this.#owner.body.querySelectorAll("ng-filter-button").forEach(el => {
-				
-				//if (!el.filterOptions) return true;
-
-				el.filterOptions.forEach(filterOptions => {
-					if (filterOptions.data.length > 0) oParam[filterOptions.colnm] = filterOptions.data;
-				});
-			}); */
 
 			const oParam = Object.fromEntries(
 				[...this.#owner.body.querySelectorAll("ng-filter-button")]
@@ -280,60 +248,53 @@ class ngFilterPanel extends HTMLElement
 			);
 			
 			this.#owner.filtering.set(oParam);
+
 			this.classList.remove("loading");
+			this.style.display = 'none';
 		});
-		
-		//$(this).hide();
-		this.style.display = 'none';
 	};
 	
 	
 	
 	#onCancel = (e) => {
-		//$(this).hide();
 		this.style.display = 'none';
 	};
 
 	#onSelectAll = (e) => {
-		var grd = this.shadowRoot.querySelector("nine-grid");
-		var idx = (grd.fields.indexOf("CHK"));
+		const grd = this.shadowRoot.querySelector("nine-grid");
+		const idx = grd.fields.indexOf("CHK");
+		const isChecked = e.target.checked; // ✅ jQuery 없이 `checked` 값 가져오기
+
+		grd.data.getValidData().forEach(m => {
+			m.v[idx] = isChecked ? "Y" : "N"; // ✅ `Y` 또는 `N` 값 설정
+		});
 
-		grd.data.getValidData().map(m => { m.v[idx] = $(e.target).prop("checked") ? "Y" : "N"; });
-		
 		grd.refreshData();
 	};
+
 	
 	
 	#onInput = (e) => {
-		var grd = this.shadowRoot.querySelector("nine-grid");
-
+		const grd = this.shadowRoot.querySelector("nine-grid");
 		
-		ninegrid.j.querySelectorAll(grd).addClass("loading");
-
+		grd.classList.add("loading");
 		
-		var data = grd.dataManager.rawRecords;
+		const data = grd.dataManager.rawRecords;
+    	data.forEach(m => { m.__ng.filtered = false; });
 		
-		data.map(m => { m.__ng.filtered = false; });
+		const v = e.target.value.toLowerCase(); // ✅ jQuery 없이 값 가져오기
+		const [LVL_IDX, DATA_IDX] = ["LVL", "DATA"].map(field => grd.fields.indexOf(field));
 
-		
-		var v = $(e.target).val().toLowerCase();
-		
+		data.forEach(m => {
+			m.__ng.filtered = m.v[LVL_IDX] === 2 && !String(m.v[DATA_IDX] || "").toLowerCase().includes(v);
+		});
 
-		const LVL_IDX	= grd.fields.indexOf("LVL");
-		const DATA_IDX	= grd.fields.indexOf("DATA");
-		
-		data.filter(m => { return m.v[LVL_IDX] == 2 && String(m.v[DATA_IDX] || '').toLowerCase().indexOf(v) < 0; }).map(m => { m.__ng.filtered = true; });
-		
 		grd.data.resetRecords();
 		
-		if (this.#timer) {
-			clearTimeout(this.#timer);
-			this.#timer = null;
-		}
+		clearTimeout(this.#timer);
 		this.#timer = setTimeout(() => {
 			grd.dataManager.viewRecords.reset();
 			grd.dataManager.viewRecords.touch();
-			//ninegrid.j.querySelectorAll(grd).removeClass("loading");
 		}, 200)
 	};
 	
@@ -344,108 +305,68 @@ class ngFilterPanel extends HTMLElement
 
 	open = (filterButton) => {
 
-		//const owner = this.shadow.closest("nine-grid");
-
 		/** 위치 */
 		const cell = filterButton.closest("th,td");
 
-		const filterButtonRect = filterButton.getBoundingClientRect();
-		const ownerRect = this.#owner.getBoundingClientRect();
-		const cellRect = cell.getBoundingClientRect();
-		const targetRect = this.getBoundingClientRect();
+		const { left: btnLeft } = filterButton.getBoundingClientRect();
+		const { left: ownerLeft, width: ownerWidth, top: ownerTop } = this.#owner.getBoundingClientRect();
+		const { top: cellTop, height: cellHeight } = cell.getBoundingClientRect();
+		const { width: targetWidth } = this.getBoundingClientRect();
 
-		let l = filterButtonRect.left - ownerRect.left;
-		if (l < 0) l = 0;
-		if (l + targetRect.width > ownerRect.width) l = ownerRect.width - targetRect.width - 5;
+		let l = Math.max(0, btnLeft - ownerLeft);
+		l = Math.min(l, ownerWidth - targetWidth - 5);
 
-		const t = cellRect.top + cellRect.height - ownerRect.top;
-
-		this.style.left = `${l}px`; // ✅ 위치 설정
-		this.style.top = `${t}px`;
-
-		
+		const t = cellTop + cellHeight - ownerTop;
 
-		//console.log(this, owner, filterButton.filterOptions, colnms);
-		
-		var col = filterButton.closest('th,td').dataset.col;
-		this.col = col;
-
-		this.#button = filterButton;
-		
-		this.style.display = 'flex';
+		Object.assign(this.style, { left: `${l}px`, top: `${t}px`, display: "flex" });
 		this.classList.add("loading");
 
-		
 		this.shadowRoot.querySelector("input[type=text]").value = "";
 
-
-		//$(this.shadowRoot).find("input[type=text]").val("");
-
 		setTimeout(() => {
-
-			
-			let data = this.#owner.data.getValidDataNF();
+			const data = this.#owner.data.getValidDataNF();
+			const col = cell.dataset.col;
+			this.col = col;
+			this.#button = filterButton;
 			
-			var ds = [];
-			filterButton.filterOptions.forEach((filterOption,i) => {
-
-				ds.push({
-					LVL: 1,
-					CHK: 'N',
-					DATA2: '<span class="group">' + $(filterButton).closest('th,td').text() + (filterButton.filterOptions.length > 1 ? ` #${i+1} (${filterOption.colnm})` : '') + '</span>',
-				});
+			const ds = filterButton.filterOptions.map((filterOption, i) => {
+				const groupLabel = `<span class="group">${cell.textContent}${filterButton.filterOptions.length > 1 ? ` #${i + 1} (${filterOption.colnm})` : ""}</span>`;
 
-				/**
-				var cell = $(`[data-col=${col}][data-bind=${filterOption.colnm}]`, this.#owner.template);
-				var expr = cell.attr("data-expr");
-				var exprFunc = (expr) ? this.#owner.exprFunction(expr) : null;
-				*/
-				
-				const cell = ninegrid.j.querySelectorAll(`[data-col="${col}"][data-bind="${filterOption.colnm}"]`, this.#owner.tmpl).elem();
-				const expr = cell.getAttribute("data-expr");
-				const exprFunc = (expr) ? this.#owner.exprFunction(expr) : null;
-
-				var data2 = [];
-				for (var rowData of data) {
-					var idx = this.#owner.fields.indexOf(filterOption.colnm);
-					
-					if (expr) {
-						var o = this.#owner.data.conv(rowData);
-						data2.push({v:o[filterOption.colnm],v2:exprFunc(o, rowData.__ng.rowidx, this.#owner.data)});
-					}
-					else {
-						data2.push({v:rowData.v[idx],v2:rowData.v[idx]});
-					}
-				}
+				const cellEl = this.#owner.tmpl.querySelector(`[data-col="${col}"][data-bind="${filterOption.colnm}"]`);
+				const expr = cellEl?.getAttribute("data-expr");
+				const exprFunc = expr ? this.#owner.exprFunction(expr) : null;
 
-				console.log(data, data2);
-
-				[...new Set(data2.sort( (a,b) => { return (a.v2||'') > (b.v2||'') ? 1 : ((a.v2||'') < (b.v2||'') ? -1 : 0); } ).map((m) => JSON.stringify(m)))].map((m) => JSON.parse(m)).forEach(o => {
-					console.log(filterOption, o);
-					ds.push({
-						LVL		: 2,
-						DATA	: o.v,
-						DATA2	: o.v2 || ` <span class="empty">(empty)</span> ${o.v}`,
-						COLNM	: filterOption.colnm,
-						CHK		: filterOption.data.length == 0 || filterOption.data.nineBinarySearch(o.v || '') >= 0 ? "Y" : "N",
-					});
+				const data2 = data.map(rowData => {
+					const idx = this.#owner.fields.indexOf(filterOption.colnm);
+					return expr ? { v: rowData.v[idx], v2: exprFunc(this.#owner.data.conv(rowData), rowData.__ng.rowidx, this.#owner.data) } : { v: rowData.v[idx], v2: rowData.v[idx] };
 				});
-			});
+
+				return [
+					{ LVL: 1, CHK: "N", DATA2: groupLabel },
+					...[...new Set(data2.map(JSON.stringify))]
+						.map(JSON.parse)
+						.sort((a, b) => (a.v2 || "") > (b.v2 || "") ? 1 : (a.v2 || "") < (b.v2 || "") ? -1 : 0)
+						.map(o => ({
+							LVL: 2,
+							DATA: o.v,
+							DATA2: o.v2 || ` <span class="empty">(empty)</span> ${o.v}`,
+							COLNM: filterOption.colnm,
+							CHK: filterOption.data.length === 0 || filterOption.data.nineBinarySearch(o.v || "") >= 0 ? "Y" : "N",
+						}))
+				];
+			}).flat();
 			
 			const grd = this.shadowRoot.querySelector("nine-grid");
 			//grd.dataSource = ds;
 			grd.fields.add(["DATA","DATA2","COLNM"]);
-			
 			grd.data.set(ds);
 			
 			// ✅ 데이터 필터링 및 체크 상태 결정
 			const checkbox = this.shadowRoot.querySelector("input[type=checkbox]");
-			checkbox.checked = grd.data.getValidData().filter(item => item.LVL == 2 && item.CHK != "Y").length === 0; // ✅ 체크 상태 설정
+			checkbox.checked = grd.data.getValidData().every(item => !(item.LVL === 2 && item.CHK !== "Y"));
 
 			this.shadowRoot.querySelector("input").focus();
-			
 			this.classList.remove("loading");
-			//ninegrid.j.querySelectorAll(this).removeClass("loading");
 		});
 	};
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ninegrid2",
   "type": "module",
-  "version": "6.245.0",
+  "version": "6.247.0",
   "main": "dist/index.js",
   "exports": {
     "import": "./dist/index.js",

package/src/etc/ngFiltering.js

@@ -230,26 +230,6 @@ class ngFilterPanel extends HTMLElement
 		this.classList.add("loading");
 		
 		setTimeout(() => {
-
-			/**
-			const LVL_IDX	= grd.fields.indexOf("LVL");
-			const CHK_IDX	= grd.fields.indexOf("CHK");
-			const COLNM_IDX	= grd.fields.indexOf("COLNM");
-			const DATA_IDX	= grd.fields.indexOf("DATA");
-			
-			const checked	= grd.data.getValidDataNF().filter(m => { return m.v[LVL_IDX] == 2 && m.v[CHK_IDX] == "Y"; });
-			//const unchecked = grd.data.getValidDataNF().filter(m => { return m.v[LVL_IDX] == 2 && m.v[CHK_IDX] != "Y"; });
-			
-			var filterOptions = [];
-			if (checked.length > 0) {
-				
-				[...new Set(checked.map(m => { return m.v[COLNM_IDX] }))].forEach(v => {
-					filterOptions.push({
-						colnm	: v,
-						data	: [...new Set(grd.data.getValidData().filter(m => { return m.v[CHK_IDX] == "Y" && m.v[COLNM_IDX] == v; }).map(m => { return m.v[DATA_IDX] || ''; }))].sort((a,b) => { return a > b ? 1 : -1; }),
-					});
-				});
-			} */
 			const [LVL_IDX, CHK_IDX, COLNM_IDX, DATA_IDX] = ["LVL", "CHK", "COLNM", "DATA"].map(k => grd.fields.indexOf(k));
 			const checked = grd.data.getValidDataNF().filter(m => m.v[LVL_IDX] === 2 && m.v[CHK_IDX] === "Y");
 			const filterOptions = checked.length > 0 ? [...new Set(checked.map(m => m.v[COLNM_IDX]))].map(v => ({
@@ -259,18 +239,6 @@ class ngFilterPanel extends HTMLElement
 			
 			
 			this.#button.filterOptions = filterOptions;
-			
-			/**
-			var oParam = {};
-			
-			this.#owner.body.querySelectorAll("ng-filter-button").forEach(el => {
-				
-				//if (!el.filterOptions) return true;
-
-				el.filterOptions.forEach(filterOptions => {
-					if (filterOptions.data.length > 0) oParam[filterOptions.colnm] = filterOptions.data;
-				});
-			}); */
 
 			const oParam = Object.fromEntries(
 				[...this.#owner.body.querySelectorAll("ng-filter-button")]
@@ -280,60 +248,53 @@ class ngFilterPanel extends HTMLElement
 			);
 			
 			this.#owner.filtering.set(oParam);
+
 			this.classList.remove("loading");
+			this.style.display = 'none';
 		});
-		
-		//$(this).hide();
-		this.style.display = 'none';
 	};
 	
 	
 	
 	#onCancel = (e) => {
-		//$(this).hide();
 		this.style.display = 'none';
 	};
 
 	#onSelectAll = (e) => {
-		var grd = this.shadowRoot.querySelector("nine-grid");
-		var idx = (grd.fields.indexOf("CHK"));
+		const grd = this.shadowRoot.querySelector("nine-grid");
+		const idx = grd.fields.indexOf("CHK");
+		const isChecked = e.target.checked; // ✅ jQuery 없이 `checked` 값 가져오기
+
+		grd.data.getValidData().forEach(m => {
+			m.v[idx] = isChecked ? "Y" : "N"; // ✅ `Y` 또는 `N` 값 설정
+		});
 
-		grd.data.getValidData().map(m => { m.v[idx] = $(e.target).prop("checked") ? "Y" : "N"; });
-		
 		grd.refreshData();
 	};
+
 	
 	
 	#onInput = (e) => {
-		var grd = this.shadowRoot.querySelector("nine-grid");
-
+		const grd = this.shadowRoot.querySelector("nine-grid");
 		
-		ninegrid.j.querySelectorAll(grd).addClass("loading");
-
+		grd.classList.add("loading");
 		
-		var data = grd.dataManager.rawRecords;
+		const data = grd.dataManager.rawRecords;
+    	data.forEach(m => { m.__ng.filtered = false; });
 		
-		data.map(m => { m.__ng.filtered = false; });
+		const v = e.target.value.toLowerCase(); // ✅ jQuery 없이 값 가져오기
+		const [LVL_IDX, DATA_IDX] = ["LVL", "DATA"].map(field => grd.fields.indexOf(field));
 
-		
-		var v = $(e.target).val().toLowerCase();
-		
+		data.forEach(m => {
+			m.__ng.filtered = m.v[LVL_IDX] === 2 && !String(m.v[DATA_IDX] || "").toLowerCase().includes(v);
+		});
 
-		const LVL_IDX	= grd.fields.indexOf("LVL");
-		const DATA_IDX	= grd.fields.indexOf("DATA");
-		
-		data.filter(m => { return m.v[LVL_IDX] == 2 && String(m.v[DATA_IDX] || '').toLowerCase().indexOf(v) < 0; }).map(m => { m.__ng.filtered = true; });
-		
 		grd.data.resetRecords();
 		
-		if (this.#timer) {
-			clearTimeout(this.#timer);
-			this.#timer = null;
-		}
+		clearTimeout(this.#timer);
 		this.#timer = setTimeout(() => {
 			grd.dataManager.viewRecords.reset();
 			grd.dataManager.viewRecords.touch();
-			//ninegrid.j.querySelectorAll(grd).removeClass("loading");
 		}, 200)
 	};
 	
@@ -344,108 +305,68 @@ class ngFilterPanel extends HTMLElement
 
 	open = (filterButton) => {
 
-		//const owner = this.shadow.closest("nine-grid");
-
 		/** 위치 */
 		const cell = filterButton.closest("th,td");
 
-		const filterButtonRect = filterButton.getBoundingClientRect();
-		const ownerRect = this.#owner.getBoundingClientRect();
-		const cellRect = cell.getBoundingClientRect();
-		const targetRect = this.getBoundingClientRect();
+		const { left: btnLeft } = filterButton.getBoundingClientRect();
+		const { left: ownerLeft, width: ownerWidth, top: ownerTop } = this.#owner.getBoundingClientRect();
+		const { top: cellTop, height: cellHeight } = cell.getBoundingClientRect();
+		const { width: targetWidth } = this.getBoundingClientRect();
 
-		let l = filterButtonRect.left - ownerRect.left;
-		if (l < 0) l = 0;
-		if (l + targetRect.width > ownerRect.width) l = ownerRect.width - targetRect.width - 5;
+		let l = Math.max(0, btnLeft - ownerLeft);
+		l = Math.min(l, ownerWidth - targetWidth - 5);
 
-		const t = cellRect.top + cellRect.height - ownerRect.top;
-
-		this.style.left = `${l}px`; // ✅ 위치 설정
-		this.style.top = `${t}px`;
-
-		
+		const t = cellTop + cellHeight - ownerTop;
 
-		//console.log(this, owner, filterButton.filterOptions, colnms);
-		
-		var col = filterButton.closest('th,td').dataset.col;
-		this.col = col;
-
-		this.#button = filterButton;
-		
-		this.style.display = 'flex';
+		Object.assign(this.style, { left: `${l}px`, top: `${t}px`, display: "flex" });
 		this.classList.add("loading");
 
-		
 		this.shadowRoot.querySelector("input[type=text]").value = "";
 
-
-		//$(this.shadowRoot).find("input[type=text]").val("");
-
 		setTimeout(() => {
-
-			
-			let data = this.#owner.data.getValidDataNF();
+			const data = this.#owner.data.getValidDataNF();
+			const col = cell.dataset.col;
+			this.col = col;
+			this.#button = filterButton;
 			
-			var ds = [];
-			filterButton.filterOptions.forEach((filterOption,i) => {
-
-				ds.push({
-					LVL: 1,
-					CHK: 'N',
-					DATA2: '<span class="group">' + $(filterButton).closest('th,td').text() + (filterButton.filterOptions.length > 1 ? ` #${i+1} (${filterOption.colnm})` : '') + '</span>',
-				});
+			const ds = filterButton.filterOptions.map((filterOption, i) => {
+				const groupLabel = `<span class="group">${cell.textContent}${filterButton.filterOptions.length > 1 ? ` #${i + 1} (${filterOption.colnm})` : ""}</span>`;
 
-				/**
-				var cell = $(`[data-col=${col}][data-bind=${filterOption.colnm}]`, this.#owner.template);
-				var expr = cell.attr("data-expr");
-				var exprFunc = (expr) ? this.#owner.exprFunction(expr) : null;
-				*/
-				
-				const cell = ninegrid.j.querySelectorAll(`[data-col="${col}"][data-bind="${filterOption.colnm}"]`, this.#owner.tmpl).elem();
-				const expr = cell.getAttribute("data-expr");
-				const exprFunc = (expr) ? this.#owner.exprFunction(expr) : null;
-
-				var data2 = [];
-				for (var rowData of data) {
-					var idx = this.#owner.fields.indexOf(filterOption.colnm);
-					
-					if (expr) {
-						var o = this.#owner.data.conv(rowData);
-						data2.push({v:o[filterOption.colnm],v2:exprFunc(o, rowData.__ng.rowidx, this.#owner.data)});
-					}
-					else {
-						data2.push({v:rowData.v[idx],v2:rowData.v[idx]});
-					}
-				}
+				const cellEl = this.#owner.tmpl.querySelector(`[data-col="${col}"][data-bind="${filterOption.colnm}"]`);
+				const expr = cellEl?.getAttribute("data-expr");
+				const exprFunc = expr ? this.#owner.exprFunction(expr) : null;
 
-				console.log(data, data2);
-
-				[...new Set(data2.sort( (a,b) => { return (a.v2||'') > (b.v2||'') ? 1 : ((a.v2||'') < (b.v2||'') ? -1 : 0); } ).map((m) => JSON.stringify(m)))].map((m) => JSON.parse(m)).forEach(o => {
-					console.log(filterOption, o);
-					ds.push({
-						LVL		: 2,
-						DATA	: o.v,
-						DATA2	: o.v2 || ` <span class="empty">(empty)</span> ${o.v}`,
-						COLNM	: filterOption.colnm,
-						CHK		: filterOption.data.length == 0 || filterOption.data.nineBinarySearch(o.v || '') >= 0 ? "Y" : "N",
-					});
+				const data2 = data.map(rowData => {
+					const idx = this.#owner.fields.indexOf(filterOption.colnm);
+					return expr ? { v: rowData.v[idx], v2: exprFunc(this.#owner.data.conv(rowData), rowData.__ng.rowidx, this.#owner.data) } : { v: rowData.v[idx], v2: rowData.v[idx] };
 				});
-			});
+
+				return [
+					{ LVL: 1, CHK: "N", DATA2: groupLabel },
+					...[...new Set(data2.map(JSON.stringify))]
+						.map(JSON.parse)
+						.sort((a, b) => (a.v2 || "") > (b.v2 || "") ? 1 : (a.v2 || "") < (b.v2 || "") ? -1 : 0)
+						.map(o => ({
+							LVL: 2,
+							DATA: o.v,
+							DATA2: o.v2 || ` <span class="empty">(empty)</span> ${o.v}`,
+							COLNM: filterOption.colnm,
+							CHK: filterOption.data.length === 0 || filterOption.data.nineBinarySearch(o.v || "") >= 0 ? "Y" : "N",
+						}))
+				];
+			}).flat();
 			
 			const grd = this.shadowRoot.querySelector("nine-grid");
 			//grd.dataSource = ds;
 			grd.fields.add(["DATA","DATA2","COLNM"]);
-			
 			grd.data.set(ds);
 			
 			// ✅ 데이터 필터링 및 체크 상태 결정
 			const checkbox = this.shadowRoot.querySelector("input[type=checkbox]");
-			checkbox.checked = grd.data.getValidData().filter(item => item.LVL == 2 && item.CHK != "Y").length === 0; // ✅ 체크 상태 설정
+			checkbox.checked = grd.data.getValidData().every(item => !(item.LVL === 2 && item.CHK !== "Y"));
 
 			this.shadowRoot.querySelector("input").focus();
-			
 			this.classList.remove("loading");
-			//ninegrid.j.querySelectorAll(this).removeClass("loading");
 		});
 	};
 }