본문 바로가기

Frontend/jQuery & JSTL

[JSTL] WebView 텍스트 동적 변경 & ajax를 이용한 파일 다운로드

반응형

WebView 텍스트 동적 변경

response를 이용해 동적으로 문장을 바꾸는 방법은 JSP에서 바로 할수는 없는 것 같다.

스크립트에서 처리해서 리턴하는 방법으로 진행

<div class="info">
	<div>
		<input type="hidden" id="korName" name="korName" value="${dataListVO.korName}">
		<input type="hidden" id="engName" name="engName" value="${dataListVO.engName}">
		<h2 id="datasetLocation"></h2>
	</div>
</div>
$(document).ready(function () {
    var korName = document.getElementById('korName').value;
    var engName = document.getElementById('engName').value;
    var location = '데이터셋 : ' + korName + ' ( ' + engName + ' )\n';

    document.getElementById('datasetLocation').textContent = location;
});

 

ajax를 이용한 파일 다운로드

// 클라이언트에서의 JavaScript 코드
$.ajax({
    url: '/dataList/excelDown.do',
    method: 'GET',
    xhrFields: {
        responseType: 'blob'  // 바이너리 데이터로 처리
    },
    success: function (data, status, xhr) {
        var disposition = xhr.getResponseHeader('Content-Disposition');
        var filename = '';
        if (disposition && disposition.indexOf('attachment') !== -1) {
			//xss방지
            var matches = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/.exec(disposition);
            if (matches != null && matches[1]) {
                filename = matches[1].replace(/['"]/g, '');
            }
        }
        var blob = new Blob([data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });

        // 파일 다운로드를 위한 링크 생성
        var link = document.createElement('a');
        link.href = window.URL.createObjectURL(blob);
        link.download = filename;
        link.click();
    },
    error: function (xhr, status, error) {
        // 오류 처리
    }
});

 

+ ) form선언시 method지정을 안해주면 default로 get 요청 함

 

++ ) span 값 재사용하기 : span값은 id가 중복되어도 그냥 사용 가능해서 복붙으로 이용

반응형

'Frontend > jQuery & JSTL' 카테고리의 다른 글

[SQL] subquery & join 작업  (0) 2023.11.13
[JSTL] datePicker, monthPicker  (0) 2023.11.06
[Spring] CSRF토큰  (0) 2023.10.27
[jQuery] attr()  (0) 2023.10.25
[jQuery] table row index 자동 입력  (0) 2023.10.24