var tableErrorData = []; var tableErrorCheckData = []; var addrMassDupliSaveList = null; var gArrRestartIndex = 0; //배열 재시작카운드 var gNameList = []; //치환문자 이름 var gPhoneList = []; //받는사람 var gInfo1List = []; //치환문자1 var gInfo2List = []; //치환문자2 var gInfo3List = []; //치환문자3 var gInfo4List = []; //치환문자4 var gMemoList = []; //메모 var $tableExcel = null; //엑셀입력 탭 var $tableClip = null; //붙여넣기 탭 var $tableSelf = null; //붙여넣기 탭 var $tableError = null; //에러 팝업 영역 $(document).ready(function(){ //Tabulator AJAX Data Loading $tableExcel = new Tabulator("#tabulator_excel", { height:"255px", width:"100%", layout:"fitColumns", autoColumns:false, headerHozAlign:"center", validationMode:"highlight", resizableColumns: false, clipboard:false, clipboardCopySelector:"table", clipboardPasteAction:"insert", // insert, update, replace placeholder:"Excel 파일을 업로드 해주세요.", //fit columns to width of table (optional) columns:[ //Define Table Columns {formatter:"rowSelection", titleFormatter:"rowSelection",clipboard:false, hozAlign:"center", headerSort:false, cellClick:function(e, cell){ cell.getRow().toggleSelect(); } }, {formatter:"rownum", hozAlign:"center" ,title:"No", hozAlign:"center", headerHozAlign:"center", width:40}, {title:"A", field:"A", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]}, {title:"B", field:"B", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]}, {title:"C", field:"C", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]}, {title:"D", field:"D", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]}, {title:"E", field:"E", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]}, {title:"F", field:"F", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]}, {title:"G", field:"G", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]} ], validationFailed:function(cell, value, parameters){ // 유효성 체크 함수 var valid = cell.isValid(); if(!valid){ alert("양식에 맞지 않는 정보가 입력되었습니다."); //해당 셀 데이터 삭제 cell.setValue(""); } return value % parameters.phone; }, }); $tableClip = new Tabulator("#tabulator_clip", { height:"255px", width:"100%", layout:"fitColumns", editor:true, headerHozAlign:"center", validationMode:"highlight", placeholder:"복사(Ctrl+C)한 내용을 여기에 붙여넣기(Ctrl+V) 해주세요.", //fit columns to width of table (optional) // clipboard:true, // 클립보드 기능 활성화 clipboardPasteAction:"update", // insert, update, replace columns: [ {formatter: "rowSelection", titleFormatter: "rowSelection", clipboard: false, hozAlign: "center", headerHozAlign: "center", headerSort: false, cellClick: function(e, cell) { cell.getRow().toggleSelect(); }}, {formatter:"rownum", hozAlign:"center" ,title:"No", hozAlign:"center", headerHozAlign:"center", width:40}, {title:"A", field:"A", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]}, {title:"B", field:"B", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]}, {title:"C", field:"C", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]}, {title:"D", field:"D", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]}, {title:"E", field:"E", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]}, {title:"F", field:"F", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]}, {title:"G", field:"G", hozAlign:"center", headerHozAlign: "center", width:125, validator:["maxLength:100", "string"]} ], validationFailed: function(cell, value, parameters) { var valid = cell.isValid(); if (!valid) { alert("양식에 맞지 않는 정보가 입력되었습니다."); cell.setValue(""); // 해당 셀 데이터 삭제 } return false; // 유효하지 않은 경우 false 반환 }, }); // 사용자 정의 필터 설정: addrPhoneNo가 빈 값이나 undefined가 아닌 경우 // $tableSelf.setFilter(function(data, filterParams) { // var value = data.addrPhoneNo; // return value !== "" && value !== undefined; // 빈 문자열과 undefined가 아닌 경우 // }); // // 테이블의 셀 편집 후 이벤트를 등록 // document.addEventListener('keydown', function(e) { // if(e.key === "Tab") { // e.preventDefault(); // let selectedCells = $tableSelf.getSelectedCells(); // let cell = selectedCells[selectedCells.length - 1]; // 현재 선택된 셀 가져오기 // // if (cell) { // let row = cell.getRow(); // let table = cell.getTable(); // let nextCell = cell.getNextCell("tab"); // // if (!nextCell && row === table.getRows().slice(-1)[0]) { // // 현재 셀이 마지막 행의 마지막 셀인 경우 // table.addRow({A: "", B: "", C: "", D: "", E: "", F: "", G: ""}, false).then(function() { // table.scrollToRow(table.getRows().slice(-1)[0]); // 새로 추가된 행으로 스크롤 // table.setActiveCell(table.getRows().slice(-1)[0].getCell("A")); // 새로운 행의 첫 번째 셀에 포커스 // }); // } // } // } // }); // //Tabulator AJAX Data Loading $tableError = new Tabulator("#tabulator_error", { height:"255px", width:"100%", layout:"fitColumns", autoColumns:false, headerHozAlign:"center", validationMode:"highlight", clipboard:false, clipboardCopySelector:"table", clipboardPasteAction:"insert", // insert, update, replace placeholder:"등록 팝업에서 휴대폰을 선택 후 확인해주세요.", //fit columns to width of table (optional) columns:[ //Define Table Columns {title:"이름", field:"name", hozAlign:"center", headerHozAlign: "center", width:125}, {title:"휴대폰", field:"phone", hozAlign:"center", headerHozAlign: "center", width:158}, {title:"미등록 결과", field:"result", hozAlign:"center", headerHozAlign: "center", width:125} ] }); // 직접입력 타블레이터 fn_selfmakeTable() // 타뷸레이터 width값 변경 시 위에 select width 값 변경 var titleArray = ["A","B","C","D","E","F","G"]; $tableExcel.on("columnWidth",function(column){ var titleIndex = titleArray.indexOf(column._column.definition.title); titleIndex += 1; if(titleIndex != 0){ $('.tableExcel .select_adr_hd>div').eq(titleIndex).css('width', column._column.width); }else{ $('.tableExcel .select_adr_hd>div').eq(0).css('width', column._column.width + 40); } }); $tableExcel.on("scrollHorizontal",function(left){ $(".tableExcel .adr_excel").scrollLeft(left); }) $(".tableExcel .adr_excel").on("scroll",function(){ $(".tableExcel .tabulator-tableholder").scrollLeft($(this).scrollLeft()); }); $tableClip.on("columnWidth",function(column){ var titleIndex = titleArray.indexOf(column._column.definition.title); titleIndex += 1; if(titleIndex != 0){ $('.tableClip .select_adr_hd>div').eq(titleIndex).css('width', column._column.width); }else{ $('.tableClip .select_adr_hd>div').eq(0).css('width', column._column.width + 40); } }); $tableClip.on("scrollHorizontal",function(left){ $(".tableClip .adr_excel").scrollLeft(left); }) $(".tableClip .adr_excel").on("scroll",function(){ $(".tableClip .tabulator-tableholder").scrollLeft($(this).scrollLeft()); }); }); function fn_selfmakeTable(){ var tableData = []; for (var i = 0; i < 1000; i++) { tableData.push({addrNm: "", addrPhoneNo: "", addrInfo1: "", addrInfo2: "", addrInfo3: "", addrInfo4: "", addrComment: ""}); } // 테이블 초기화 $tableSelf = new Tabulator("#tabulator_self", { height: "255px", width: "100%", layout: "fitColumns", clipboardPasteAction: "update", keybindings: { "navRight": "tab", // Tab 키를 누르면 오른쪽 셀로 이동 "navLeft": "shift+tab", "editNext": false // Tab 키를 누를 때 편집 모드를 종료하지 않도록 설정 }, data: tableData, columns: [ {formatter: "rowSelection", titleFormatter: "rowSelection", clipboard: false, hozAlign: "center", headerHozAlign: "center", headerSort: false, cellClick: function(e, cell) { cell.getRow().toggleSelect(); }}, {formatter:"rownum", hozAlign:"center" ,title:"No", headerHozAlign:"center", width:40}, {title:"이름", field:"addrNm", hozAlign:"center", headerHozAlign: "center", width:119, validator:["maxLength:100"], editor:"input"}, {title:"휴대폰", field:"addrPhoneNo", hozAlign:"center", headerHozAlign: "center", width:119, validator:["maxLength:100"], editor:"input" , cellEdited:function(cell){ var currentValue = cell.getValue(); console.log('cell.getValue() : ', currentValue); // 현재 값이 null 또는 undefined가 아니고, 값이 변경된 경우에만 처리 if (currentValue !== null && currentValue !== '' ) { var newValue = fn_selfUpdataCount(currentValue); // 값이 실제로 변경된 경우에만 setValue 호출 if (currentValue !== newValue) { cell.setValue(newValue); } } } }, {title:"[*1*]", field:"addrInfo1", hozAlign:"center", headerHozAlign: "center", width:119, validator:["maxLength:100"], editor:"input"}, {title:"[*2*]", field:"addrInfo2", hozAlign:"center", headerHozAlign: "center", width:119, validator:["maxLength:100"], editor:"input"}, {title:"[*3*]", field:"addrInfo3", hozAlign:"center", headerHozAlign: "center", width:119, validator:["maxLength:100"], editor:"input"}, {title:"[*4*]", field:"addrInfo4", hozAlign:"center", headerHozAlign: "center", width:119, validator:["maxLength:100"], editor:"input"}, {title:"메모", field:"addrComment", hozAlign:"center", headerHozAlign: "center", width:119, validator:["maxLength:100"], editor:"input"} ], navigation: true // 키보드 탐색 활성화 }); }