전체 글

jQuery 에서 라이브러리 형태로 제공되는 다이얼로그를 사용하면 보다 간단하게 세련된 디자인의 다이얼로그를 사용할 수 있게 된다. 아래 링크에서 해당 라이브러리를 받을 수 있다. 이 때 반드시 필요한 파일은 jquery-ui.js와 jquery-ui.css 두 가지이다. https://jqueryui.com/download/ Download Builder | jQuery UI Download Builder jqueryui.com jQuery Dialog 호출 방식 먼저 다이얼로그를 호출할 Element가 필요하다. 그 다음, 해당 Element에 다이얼로그를 호출하는 코드는 아래와 같다. 주로 사용해본 옵션과 함수들을 나열했다. $('#dialogSample').dialog({ dialogClass: ..

requirejs.undef([js 모듈 경로]); 제이쿼리 다이얼로그를 이용해 같은 화면을 여러 번 띄울 때, html파일은 하나지만 계속해서 다른 데이터를 보여줘야 하게 되었다. 이 때 RequireJS를 통해 모듈 관리를 하고 있는 상태에서, 이미 모듈이 한 번 로드되고나면 이후에 다른 데이터를 보여줘야할 때에도 이전 값이 나오게 되어 방법을 강구하게 되었다...! requirejs의 글로벌 함수 undef을 사용하면 정의되지 않은 모듈을 허용하며, 모듈 내부 상태를 리셋하기 때문에, 내 경우에는 다이얼로그를 닫을 때(정확히는 beforeClose 함수 호출 시에) 모듈을 리셋하도록 하였다.

스코프 객체를 참조하는 것이 무한히 반복될 때 발생하는 것 같다..! 나 같은 경우에는 ng-include="스코프 변수" 형태로 URL을 동적으로 할당하고 이를 페이지에 나타나게 하려는 코드가 inlcude 되는 페이지와 include하려는 페이지 모두에 존재해 나타난 문제였다. 특정 페이지를 무한히 include하게 되는 식으로 스코프 변수에 값을 할당하는 작업이 무한히 반복되어 나타나는 바람에 문제가 발생했고, 한 쪽의 코드를 지움으로써 해결 했다.

일반적으로 jQuery를 사용해 요소에 이벤트를 걸고자 할 때, 아래와 같이 걸게 된다. $().on("event", function(e) { ... }); 이렇게 이벤트를 걸던 중, 해당 이벤트를 바인딩할 때 존재하는 데이터를 함께 전달해야하는 상황이 있었다. 나는 단순히 아래와 같이 했지만.. 해당 이벤트가 바인딩되기 보다는 해당 이벤트의 콜백함수가 바로 실행되는 문제가 생겼다. $().on("event", function(e, data) { ... }); 제이쿼리 공식 API 문서를 보면 데이터를 함께 전달하고자 할 때에는 아래와 같이 보내야 한다고 명시하고 있다. $().on("event", {dataName: data}, function(e) { ... });

1. 콘솔 로그 이슈 1(JXLS 버전 문제) 회사 제품의 데이터 엑셀 다운로드 기능 실행 시 값이 'null'인 데이터에 대해서는 출력하지 않으면 되는데, 굳이 아래와 같은 로그를 찍는 이슈가 있었다. "1018 [AWT-EventQueue-0] WARN org.apache.commons.jexl2.JexlEngine - org.jxls.expression.JexlExpressionEvaluator.evaluate@61![0,19]: ‘변수명' inaccessible or unknown property transaction" 스택오버플로우의 몇 가지 글을 보자 버전업을 해야한다는 의견이 다수였고, 실제로 2.4.6 버전이던 JXLS를 2.10.0 버전으로 업그레이드 함으로써 더이상 null값에 대한 경..

해당 글은 노마드 코더의 '세션 vs 토큰 vs 쿠키? 기초개념 잡아드림. 10분 순삭!' 영상의 내용을 기억하기 위해 작성한 글입니다. Cookie 브라우저에 저장됨. 즉, 웹에서만 사용 가능하고 앱에서는 사용 불가 -> 이런 경우 앱에서는 쿠키 대신 토큰(token) 사용 서버의 response로부터 브라우저에 저장하고자 하는 데이터를 쿠키로 저장 저장 후에는 해당 웹사이트에 방문시마다 브라우저는 해당 쿠키도 request와 함께 전송하게 됨 쿠키는 도메인에 따라 제한됨. 즉, 특정 웹사이트에서 받은 쿠키는 해당 웹사이트에만 전송됨 쿠키는 유효 기간이 존재. ex) 하루, 일주일, 한달 등 인증 뿐만 아니라 여러 정보를 저장 가능. ex) 언어설정 등의 사용자 설정 Token 서버에 토큰을 보냄으로써..

Java에서 템플릿을 이용해 Excel 파일을 다운로드 하기 위해서는 크게 두 가지 경우를 사용한다. 'JExcel'을 사용하는 방식과 'POI + Jxls'를 사용하는 방식이 그것이다. 이 글에서는 내가 직접 사용해본 'POI + Jxls'을 사용하는 방식에 대해서 간단히 정리할 것이다. 1. POI 우선 POI란 아파치 소프트웨어 재단에서 만든 라이브러리로서 마이크로소프트 오피스 파일 포맷을 순수 자바 언어로서 읽고 쓰는 기능을 제공한다. 주로 워드, 엑셀, 파워포인트와 파일을 지원하며 최근의 오피스 포맷인 Office Open XML File Formats (OOXML, 즉 xml 기반의 *.docx, *.xlsx, *.pptx 등) 이나 아웃룩, 비지오, 퍼블리셔 등으로 지원 파일 포맷을 늘려가고..

$.each() 특정 요소의 하위 요소를 하나씩 꺼내기를 반복한다. Javascript의 Array.forEach와 같은 기능을 한다. + $.each()에서는 일반적인 for문처럼 break, continue가 되지 않는지 의문이었으나 아래와 같이 대체하여 사용할 수 있다. $.each(list, function(idx, item) { if(expression) { return false; // break; return true; // continue; } });

Closest(), find() 함수는 모두 선택한 요소를 기점으로 특정 요소를 찾는 역할을 한다. Closest() jQuery 선택자로 선택한 요소로부터 상위 요소로 옮겨가며 해당 조건에 맞는 요소를 찾을 때까지 탐색한다. 조건에 맞는 가장 가까운 부모 요소를 찾으면 탐색을 중단한다. find() jQuery 선택자로 선택한 요소로부터 하위 요소로 옮겨가며 해당 조건에 맞는 요소를 찾을 때까지 탐색한다. 조건에 맞는 가장 가까운 자식 요소를 찾으면 탐색을 중단한다. cf. filter() 자신의 자식(하위) 요소들 중 조건에 맞는 모든 요소를 찾는다. find()와 마찬가지로 자식 요소에서 검색하는 역할을 수행하나, 그 대상이 하나인지 여러개인지에 차이가 있다. cf. Javascript - Arra..

outerHTML, innerHTML HTML에서 제공하는 함수로, 자신을 포함한 HTML, 자신 하위의 HTML을 반환한다. Test cf. innerTEXT : 내부의 텍스트를 반환한다. cf. jQuery에서 innerHTML과 유사한 html() 함수는 제공하나, outerHTML 기능을 제공하진 않는다. 하지만 outerHTML함수와 같은 기능으로 동작하는 함수를 사용자 정의 함수로 구현할 수 있다. $.fn.outerHTML = function () { return $(this).clone().wrapAll("").parent().html(); } 선택한 요소를 div(다른 태그여도 상관없다.)로 감싸고, 이 div(선택한 요소의 parent)의 내부 html을 추출하는 방식이다.