My Coding World

test 이 코드에서 data-row-key="0" data-column-name="prod_cd" 해당되는 값만 변경하고자 하는 코드를 작성하고 한다면? 아래와 같이 JavaScript를 사용하여 해당 요소의 값을 변경할 수 있습니다. const tdElement = document.querySelector('td[data-row-key="0"][data-column-name="prod_cd"]'); tdElement.setAttribute('data-row-key', '1'); tdElement.setAttribute('data-column-name', 'new_column_name'); tdElement.querySelector('.tui-grid-cell-content').textContent =..

toast grid에서 input값을 넣을때 자꾸 null이 찍혀서 짜증날때 간편 해결법이 있습니다. 위의 증상이죠. 기본 CustomTextEditor 의 내용을 일부 수정하는 것인데요, class CustomTextEditor { constructor(props) { const el = document.createElement('input'); const {maxLength} = props.columnInfo.editor.options; el.type = 'text'; el.maxLength = maxLength; el.value = String(props.value); this.el = el; } getElement() { return this.el; } getValue() { return this..

git에서 쓸만한 코드를 가져와서 압축을 풀면 나타나는 폴더의 역할에 대해서 기본적으로 알아야 하는 것들이 있습니다. 보통 위와 같이 압축을 풀면 나타나지요. src 는 딱 봐도 source를 나타내는 것일줄 알겠는데... src는 source의 약자이며, dist는 ? 어떤 약자일 거란 추측은 되지만 정확히 무슨 의미인지 모르는 경우가 많습니다. 소프트웨어에서 dist는 distribution(유통시키다. 배포하다.)의 약자입니다. 비슷한 폴더 이름으로 사용되는 사례는 dest(destination)가 있습니다. dist 폴더는 src의 typescript 코드가 nodejs에서 작동하기 위해 javascript 코드로 컴파일된 결과물입니다. dist 폴더 자체는 실제로 배포 단계에서 사용됩니다. 결과..

웹브라우저에서 프로그램을 개발하다 보면 자주 접하는 콘솔창 에러.... 너무 자주 나와서 이제는 지겨워 진다. 콘솔창이 깔끔하지 않아 보기에 불편한데, 개발자모드 설정 변경으로 간단하게 숨길 수 있다. 이를 해결하기 위해서는 우측 상단에 표시 된 톱니바퀴 버튼을 눌러 설정 페이지로 진입한다. Sources 탭의 "Enable JavaScript source maps"를 체크 해제 후 콘솔창으로 돌아와 새로고침을 하면, 콘솔창이 깔끔해진 걸 볼 수 있다. 이렇게 하면 위의 에러메시지가 싹 사라지니 속이 다 시원해진다~~~ 이런거 하나씩 하나씩 배워서 늘려가야 겠다.

웹사이트에 필요한 기능을 이것저것 구현하던 중 뭔가 팝업창을 띄우고 그 창을 닫을때 원래 있던 화면에 적용하고 싶다면 아래의 내용이 도움이 될 것입니다. 간단하지만, 알고 있느냐 모르느냐는 엄청난 차이가 있는 것 같아요. 실제 작업스케줄을 나타내는 달력에서 해당 현장명을 누르면 나오는 화면은 아래와 같습니다. 위의 화면에서 창닫기를 하면 변경한 내용이 스케줄표에 적용되서 나오게 만들고 싶어서.... 코드는 아주 간단하네요. 실제 작성해서 사용한 코드입니다. $(document).ready(function(){ // 윈도우 닫기 버튼 클릭 (부모창 변경사항 적용) window.addEventListener('unload',e => opener.location.reload() ); }); 닫기 버튼을 누르면..

서버에서 간단하게 txt파일을 자바스크립트에서 읽어오는 함수이다. php와 자바스크립트로 코딩을 하다보면, 간단한 정보를 서버에 저장하고, 그 정보를 읽어와서 처리하는 구조로 작성하고자 할때, 어떤 동작을 실행 버튼을 누르면 서버 내용을 간단히 읽어오는 프로그래밍을 할때 유용한 코드이다. 실전 코딩에서 세션의 아이디를 3시간마다 발급받아서 비교하는 구문을 작성할때 사용하였다. loadFile('SESSION.txt'); 콘솔에 해당 세션아이디 값을 볼 수 있었다. function loadFile(filePath) { var result = null; var xmlhttp = new XMLHttpRequest(); xmlhttp.open("GET", filePath, false); xmlhttp.send(..

toast UI Grid는 무료인데, 기능도 많고 참 좋은 것 같다. Jexcel 사용하다가, 가끔 서비스를 block하는 경우가 있어서 전부 toast UI Grid로 변경해서 사용하고 있다. 그리드의 내용을 html input hidden 형태로 해서 form를 넘기는 방식으로 구현해 봤는데, 잘 되는 것 같다. 이때 가장 고민이 되었던 것이, 배열형태로 전달하는 콤마문제였다. 그래서 콤마를 함수를 통해 파이프(|) 문자로 바꾸고 다시 디코드하는 방식으로 처리했다. 인코딩 -> 디코딩... 이런식이 아무래도 계속 사용해야 하는 부분인가보다. 본문의 php의 input hidden 형태이다. > > > > > > > > > > >

초를 입력하면, '00:00:00' 이런 형식으로 변환하는 함수가 자바스크립트에 있지 않을까? 밀리세컨드로 변환할 수 있는 함수도 함께 기록해 본다. 시간을 표시할때 자주 사용될 함수로 기록될 것이다. function msToTime(duration) { var milliseconds = parseInt((duration % 1000) / 100), seconds = Math.floor((duration / 1000) % 60), minutes = Math.floor((duration / (1000 * 60)) % 60), hours = Math.floor((duration / (1000 * 60 * 60)) % 24); hours = (hours < 10) ? "0" + hours : hours; mi..