Frontend/jQuery & JSTL (50) 썸네일형 리스트형 12/07 회고 JSON데이터 재가공 이미 JSON데이터는 API명세서로 고정되어 수정이 불가능한데 컬럼데이터가 한번 더 불러와져야 하는 상황이 생김 JSON데이터를 재가공하는 방법을 찾아냄 ... // 각 시도별로 그룹핑 let sigunguData = allDatas2; const groupedData = {}; sigunguData.features.forEach(feature => { const sidoName = feature.properties.SIDO_KOR_NAME; if (!groupedData[sidoName]) { groupedData[sidoName] = { sidoOldRate: feature.properties.OLD_RATE, data: [] }; } groupedData[sidoName].da.. 12/05 회고 라디오버튼 라디오 버튼만 만들어 놓는다면 선택지를 고르면 무조건 선택되고 null로 되돌아갈 수 없다 ∵ 보통은 초기화 버튼을 같이 만들어 둠 type : 정의(radio) / id : 고유값 / name : 같은 선택지( name이 다르면 다른 그룹으로 생각함) / value : 선택 값 / checked : 선택됨(사용안하면 초기 선택값이 없음) 전체 기간 이벤트 리스너 //요소가 가진 값이 반경될때 => 라디오버튼 $("#total, #period").on("change", function () { mapReload($(this).val()); console.log("mode Change"); }); //요소 자체의 값이 반경될때 => 드롭박스 $(".changeMode").on("change", .. [JSTL] 페이지 작업 span으로 지정된 값 가져오기 초기 값이 ""이기 때문에 document를 읽어온 후에 적용해야 한다. ... ${dataCode.dataCodeCaption} ... [jQuery] tab관리 작업 tab을 선택하면 선택 위치에 따라서 모서리 굴곡이 달라지게 수정 (e.g. 3개의 탭중 처음 탭을 선택하면 좌측 상단에 굴곡이 생김, 마지막 탭을 선택하면 우측 상단에 굴곡이 생김) $(".date .tab li").on( "click", function() { let sel = $(this).index(); $(this).addClass("on").siblings().removeClass("on"); //var pageUrl; if (sel == 0) { $(".date .tabContents").css({borderTopLeftRadius : 0}); $(".date .tabContents ol > li").removeClass("on"); $(".date .tabContents ol > li")... [JSTL] data와 li요소 항목 비교해서 표시하기 고도화를 하던 도중 li메뉴를 구성하는 방식과 카드 이미지로 표현해야 하는 부분이 같이 반영되야 하는 부분이 있었다. 이전에 구축되어 있는 환경에서 카드 이미지는 hardcoding되어 있었기 때문에 카드 이미지 data를 기준으로 li를 보여주거나 숨기는 방식을 취해야 했다. 1. 이미지 data를 순회하여 배열을 가져옴 2. 이미지의 value와 li를 비교하여 display || none처리 3. ajax로 html형식으로 반환 ... 하위메뉴1 ... 하위메뉴2 ... 하위메뉴3 ... 하위메뉴4 ... ... [jQuery] 백분위수 배열 function calculatePercentile(data, percentile) { // 데이터 배열을 정렬 const sortedData = data.slice().sort((a, b) => a - b); // 백분위에 해당하는 인덱스 계산 const index = (percentile / 100) * (sortedData.length - 1); // 정수 인덱스와 소수점 부분 분리 const integerPart = Math.floor(index); const decimalPart = index - integerPart; // 백분위 값 계산 let percentileValue; if (decimalPart === 0) { // 정확한 인덱스가 있는 경우 percentileValue = sorte.. [SQL] subquery & join 작업 dataseq에 대한 data테이블의 요소가 group테이블에 포함된 데이터 인지를 Y, N으로 구분하려고 하였다. 작업하면서 subquery와 join을 같이 사용할때의 개념이 정확하게 인식되지 않은 것 같아 작성해보았다. // 이렇게 하면 join으로 seq가 동일한 데이터를 가져오기 때문에 전체가 Y로 체크됨 SELECT c.group_seq , c.group_title , c.option_yn , c.option_type , c.group_sort , c.use_yn , c.group_code , case when (select count(*) from public.dataset_request where dataset_request_seq = #{datasetRequestSeq} and datas.. [JSTL] datePicker, monthPicker 달력 datepicker / monthpicker datepicker : 캘린더 형태로 연월일 선택이 가능한 기능 monthpicker : 캘린더 형태로 연월 선택이 가능한 기능 $(".datepicker").datepicker({ changeYear: true, changeMonth: true, dateFormat: "yy-mm-dd" }); $('.js-monthpicker').monthpicker({ altFormat: 'MM y' }); 연월 ~ 연월일 ~ monthpicker 출처 https://github.com/tlemens/jquery-ui-monthpicker GitHub - tlemens/jquery-ui-monthpicker: A jQuery UI monthpicker A jQuery.. 이전 1 2 3 4 5 6 7 다음
