프런트엔드

    [javascript, Vue] fs을 이용한 Vue Component import 자동화 파일 생성

    컴포넌트들을 만든 후 index.js에 각 Vue 컴포넌트를 "수기로 import" 해야하는 상황이 발생하여 자동화가 필요하여 추가 자동화할 대상들은 components 하위에 있는 1depth Directory에 index.js 생성이 필요 하지만 각 1dpeth Directory 밑에는 모듈별 컴포넌트들이 존재하여 아래 Depth에 컴포넌트들도 모두 스캔이 필요 /dialog/index.js import ApprovalHistoryModal from './approval/ApprovalHistoryModal.vue'; import ApprovalLineModal from './approval/ApprovalLineModal.vue'; import ApprovalModal from './approval..

    [javascript] axios multi form 데이터 처리

    [소스 환경] BackEnd : Spring boot, jdk17, Lombok Front: Vue, Axios BackEnd에서 파일을 수정하는 로직을 배열로 받아 처리하는 부분이 포함 Axios에서 Form을 배열로 전달해야하는 상황이 발생 @PutMapping(value = "[주소]", consumes = MediaType.MULTIPART_FORM_DATA_VALUE, produces = MediaType.APPLICATION_JSON_VALUE) public SuccessResponse [메소드명] (@PathVariable String id, @Valid @ModelAttribute Requests requests) { return new SuccessResponse(service.upser..

    [jqGrid] 테이블 첫번째 로우 선택하기

    jqGrid document: http://www.trirand.com/jqgridwiki/doku.php?id=wiki:jqgriddocs jqGrid demo: http://trirand.com/blog/jqgrid/jqgrid.html 첫번째 로우 선택 소스 $('#gridOper').jqGrid({ url: '/test/list', postData: { ... }, colModel: [ { label: 'test', name: 'test', key: true, hidden: true}, ... ], onSelectRow: function(rowid, status){ //로우 선택시 처리하는 부분 console.log($('#gridOper').getRowData(rowid)); }, loadCom..

    [jquery/제이쿼리] ajax() async, complete, beforeSend 설정

    제이쿼리 ajax는 많이 사용하는데 항상 헷갈리는 조건이 있다. 바로 async... 동기/비동기에 관한 설정인데.. 머리가 나빠서인지 자꾸 잊어버린다.. async (default: true) Type: Boolean -> 기본이 비동기(true)처리이고 동기(false)처리를 하려면 변경이 필요하다. - 비동기: 로직의 실행이 끝날때까지 기다려주지 않고 나머지 코드를 먼저 실행하는것을 말한다. 즉, 순서에 상관없이 실행된다. - 동기: 처리가 된 이후에 다음 로직이 실행된다. 즉, 실행 순서가 있다. $.ajax({ type: "POST", url: '/rest/name/select', dataType: "json", data: {userId:10}, async: false, //동기처리 (기본이 t..

    [jquery] extends() 사용법

    API문서를 확인해본 결과 크게 2가지 형식으로 쓸 수 있는 것 같다. 1. jQuery.extend (target, object1 [, objectN]) -> var object = $.extend({}, object1, object2); -> target객체에 뒤에 받는 object1, object2... 를 확장한다. -> 같은 이름을 가진 오브젝트는 뒤에 있는 오브젝트에 값으로 덮어쓰기가 된다 {"apple":0,"banana":{"price":200},"cherry":97,"durian":100} 2. jQuery.extend( [deep ], target, object1 [, objectN ] ) -> var object = $.extend( true, object1, object2 ); ->..

    [Jquery] 부모 요소 찾는 방법

    1. parent : 요소에 부모에 있는 class나 태그를 찾을 수 있다. 단 여러개일 경우 처리가 필요. 예시 ) $( "p" ).parent( ".selected" ).css( "background", "yellow" ); 2. closest : 해당요소에서 찾고자하는 가장 처음에 값을 전달해준다. 여러개가 존재하는 태그, 클래스일때 유용하게 쓴다. 예시) $( event.target ).closest( listElements ).toggleClass( "highlight" ); 처음에는 모르고 parent만 쓰다가 closest를 알게 된 후 저거를 자주 쓴다. 자기꺼에 가장 가까운 것을 찾아주기 때문에 내가 쓸 때 가장 최적인듯 싶다.

    [Jqgrid] MultiSelect 여부에 따라 데이터 가져오기

    Jqgrid 옵션에 따라 selrow, selarrrow가 매우 헷갈린다.. 맨날 찾아보는 정보 잘 정리하신 분 거 기억해두자.. (1) 단일 Row 일 경우 선택하여 값을 불러오기 (multiSelect : false) var obj = $("#ListTable"); var rowId = obj.jqGrid("getGridParam", "selrow"); var value = obj.jqGrid('getCell', rowId, 'ColumnName'); (2) MultiSelect 다중 Row 일 경우 값 출력 해보기 (multiSelect : true) var obj = $("#ListTable"); var idx = obj .jqGrid('getGridParam', 'selarrrow'); for(..