<script>
        $(function(){
            //datepicker
            $('.datepicker').not('.readonly').datepicker({
                format: 'dd-mm-yyyy',
                startDate: '+1d'
            }).on("blur", function(){
            	var dataRegexp = /[0-9]{4}-?(0[1-9]|1[012])-?(0[1-9]|[12][0-9]|3[01])/;
                if (!dataRegexp.test($(this).val()) ) {
                    $(this).val("");
                }
            });
            $.datepicker.setDefaults({
                dateFormat: 'yymmdd',
                prevText: '이전 달',
                nextText: '다음 달',
                monthNames: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
                monthNamesShort: ['1','2','3','4','5','6','7','8','9','10','11','12'],
                dayNames: ['일', '월', '화', '수', '목', '금', '토'],
                dayNamesShort: ['일', '월', '화', '수', '목', '금', '토'],
                dayNamesMin: ['일', '월', '화', '수', '목', '금', '토'],
                showMonthAfterYear: true,
                changeYear: true, //콤보박스에서 년 선택 가능
                changeMonth: true, //콤보박스에서 월 선택 가능
                yearRange: 'c-100:c+10'
            });
        });
    </script>
반응형
저작자표시

'개발 > Javascript' 카테고리의 다른 글

jquery를 이용한 특정영역에 input Max값 Min값 구하기  (0) 2022.07.05
스크립트 엑셀 Export  (0) 2022.05.20
스크립트 엑셀 업로드  (0) 2022.05.10
소수점 입력 제어 스크립트 및 정수 입력 제어 스크립트  (0) 2021.11.24
input or select 등 객체의 class를 이용한 필수 입력체크  (0) 2021.11.24

스크립트로 엑셀 업로드가 가능하여 테스트해봄.

 

case 1) 엑셀을 업로드하여 화면에 단순 표시

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>엑셀 업로드 테스트</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.16.9/xlsx.full.min.js"></script>
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
	function upload(event) {
		var input = event.target;
		var reader = new FileReader();
		reader.onload = function() {
			var fdata = reader.result;
			var read_buffer = XLSX.read(fdata, {type : 'binary'});
			
			var xlsArea = document.getElementById("xlsArea");
			var tableStr = "<table style='border:1px solid;'>";
			
			read_buffer.SheetNames.forEach(function(sheetName) {
				var rowdata = XLSX.utils.sheet_to_json(read_buffer.Sheets[sheetName]);
				//console.log("[" + sheetName + "] 시트 데이터 : " + JSON.stringify(rowdata));
				
				$.each(rowdata, function(i, coldata){
					//console.log(rowdata);
					
					//엑셀 Header 세팅
					if(i == 0){
						tableStr += "<tr>";
						$.each(coldata, function(colHeader, colText){
							tableStr += "<th style='color:red;width:500px;border:1px solid;'>" + colHeader + "<th>";
						});
						tableStr += "</tr>";
					}
					
					//엑셀 내용 세팅
					tableStr += "<tr>";
					$.each(coldata, function(colHeader, colText){
						tableStr += "<td style='border:1px solid;'>" + colText + "<td>";
					});
					tableStr += "</tr>";
				});
			});
			
			tableStr += "</table>";
			xlsArea.innerHTML = tableStr;
			//console.log(tableStr);
		};
		reader.readAsBinaryString(input.files[0]);
	}
</script>

</head>
<body>
	<input type="file" id="id_file_upload" onchange="upload(event)"/>
	<br /><br />
	<div id="xlsArea"></div>
</body>
</html>

 

case 2) 엑셀을 업로드하여 화면에서 수정 후 서버에 반영

(원래 엑셀을 서버로 업로드하는 부분과 export 하는 부분을 구현하려 하였으나 화면에 보여줄때 input 등으로 표시하고 수정하여 서버에 반영하면 필요없을 듯하여 수정)

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>엑셀 업로드 테스트</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.16.9/xlsx.full.min.js"></script>
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
	function upload(event) {
		var input = event.target;
		var reader = new FileReader();
		reader.onload = function() {
			var fdata = reader.result;
			var read_buffer = XLSX.read(fdata, {type : 'binary'});
			
			var $xlsArea = $("#xlsArea");
			var $table = $("<table>", {style:"border:1px solid;"});
			
			read_buffer.SheetNames.forEach(function(sheetName) {
				var rowdata = XLSX.utils.sheet_to_json(read_buffer.Sheets[sheetName]);
				//console.log("[" + sheetName + "] 시트 데이터 : " + JSON.stringify(rowdata));
				
				$.each(rowdata, function(i, coldata){
					//console.log(rowdata);
					
					//엑셀 Header 세팅
					if(i == 0){
						var $headerTr = $("<tr>");
						$.each(coldata, function(colHeader, colText){
							var $th = $("<th>", {style : 'color:red;width:500px;border:1px solid;', text : colHeader});
							$headerTr.append($th);
						});
						$table.append($headerTr);
					}
					
					//엑셀 내용 세팅
					$tr = $("<tr>");
					$.each(coldata, function(colHeader, colText){
						var $td = $("<td>", {style : 'border:1px solid;'});
						var $ipt = $("<input>", {type : "input", value : colText, name : colHeader, style : "width:97%;"});
						$td.append($ipt);
						$tr.append($td);
					});
					$table.append($tr);
				});
			});
			
			$xlsArea.append($table);
			//console.log(tableStr);
		};
		reader.readAsBinaryString(input.files[0]);
	}
</script>

</head>
<body>
	<input type="file" id="id_file_upload" onchange="upload(event)"/>
	<br /><br />
	<div id="xlsArea"></div>
</body>
</html>

 

 

반응형
저작자표시

'개발 > Javascript' 카테고리의 다른 글

스크립트 엑셀 Export  (0) 2022.05.20
datepicker 관련 스크립트 제어  (0) 2022.05.19
소수점 입력 제어 스크립트 및 정수 입력 제어 스크립트  (0) 2021.11.24
input or select 등 객체의 class를 이용한 필수 입력체크  (0) 2021.11.24
jquery validator 사용시 전화번호 형식 및 날짜 형식 추가  (0) 2021.11.24

WebApplicationInitializer 인터페이스를 사용하면 web.xml에서 했던 서블릿, 필터, 리스너 설정 등을 java로 설정할 수 있다.
처음에 그것도 모르고 web.xml에 아무것도 없어 당황을....^^;

프로젝트를 하나 만들어 아래와 같이 간단히 등록하고 테스트를 해보니 정상 동작되는 것을 확인했다.

 

package testweb;
 
import javax.servlet.FilterRegistration;
import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.ServletRegistration;
 
import org.springframework.web.WebApplicationInitializer;
import org.springframework.web.context.ContextLoaderListener;
import org.springframework.web.context.support.AnnotationConfigWebApplicationContext;
import org.springframework.web.filter.CharacterEncodingFilter;
import org.springframework.web.servlet.DispatcherServlet;
 
public class Init implements WebApplicationInitializer {
 
	@Override
	public void onStartup(ServletContext servletContext) throws ServletException {
		System.out.println("onStartup...");
		addListender(servletContext);
		addDispatcher(servletContext);
		addFilter(servletContext);
	}
 
	public void addListender(ServletContext servletContext) {
		System.out.println("addListender...");
		AnnotationConfigWebApplicationContext appContext = new AnnotationConfigWebApplicationContext();
		appContext.register(AppConfig.class);
		ContextLoaderListener listender = new ContextLoaderListener(appContext);
		servletContext.addListener(listender);
	}
 
	public void addDispatcher(ServletContext servletContext) {
		System.out.println("addDispatcher...");
		AnnotationConfigWebApplicationContext webContext = new AnnotationConfigWebApplicationContext();
		webContext.register(WebConfig.class);
		DispatcherServlet dispatcherServlet = new DispatcherServlet(webContext);
		ServletRegistration.Dynamic webServlet = servletContext.addServlet("webServlet", dispatcherServlet);
		webServlet.addMapping("/");
		webServlet.setLoadOnStartup(1);
	}
 
	public void addFilter(ServletContext servletContext) {
		System.out.println("addFilter...");
		CharacterEncodingFilter encodingFilter = new CharacterEncodingFilter("UTF-8", true, true);
		FilterRegistration.Dynamic webEncodingFilter = servletContext.addFilter("webEncodingFilter", encodingFilter);
		webEncodingFilter.addMappingForUrlPatterns(null, false, "/*");
	}
}

 

반응형
저작자표시

'개발 > JAVA' 카테고리의 다른 글

Websocket을 이용한 메세지 보내기 받기(java, jsp)  (0) 2020.07.08
엑셀 업로드(전자정부프레임워크)  (1) 2020.05.06
엑셀 다운로드(전자정부프레임워크 + Tabulator 사용)  (0) 2020.05.06
전자정부프레임워크(3.8.0버전)에 Tiles 적용하기  (0) 2020.04.10
전자정부프레임워크에서 로그인 체크를 위한 인터셉터 설정하기  (0) 2020.02.14

+ Recent posts

티스토리툴바