반응형 웹개발67 ajax로 form data(multipart) 전송 하기 출처사이트 : https://wondongho.tistory.com/96 HTML JQuery $("#btnSubmit").click(function (event) { //preventDefault 는 기본으로 정의된 이벤트를 작동하지 못하게 하는 메서드이다. submit을 막음 event.preventDefault(); // Get form var form = $('#fileUploadForm')[0]; // Create an FormData object var data = new FormData(form); // disabled the submit button $("#btnSubmit").prop("disabled", true); $.ajax({ type: "POST", enctype: 'multip.. 2022. 2. 17. ajax로 데이터 주고받기 출처사이트 https://ttuk-ttak.tistory.com/21 [Spring] 스프링 ajax로 데이터 주고받기 Spring 프레임워크로 개발 도중, JSP에서 Controller로 / Controller에서 JSP로 데이터를 주고 받는 경우가 생겼다. 이 때, AJAX를 사용하여 간단하게 처리하였다. CASE 1 : 스프링에서 JSP로 데이터를 보낼 때 M ttuk-ttak.tistory.com Spring 프레임워크로 개발 도중, JSP에서 Controller로 / Controller에서 JSP로 데이터를 주고 받는 경우가 생겼다. 이 때, AJAX를 사용하여 간단하게 처리하였다. CASE 1 : 스프링에서 JSP로 데이터를 보낼 때 MainController.java @RequestMappi.. 2022. 2. 17. 한글 깨짐 해결 방법 출처사이트 https://www.ince.co.kr/255 [java][javaScript] java와 javaScript 사이의 한글전송 깨짐현상 해결법 오랜만에 블로그 포스팅을 하게 되네요 ^^ 그간 이직 하고 하고 싶던 프로그래밍 원없이 했습니다. 이제좀 프로그래머로서의 삶을 다시 사는 느낌이네요. 이번 프로젝트 진행중에 발생한 문제를 www.ince.co.kr DB -> java 데몬 -> javaScript 로 데이터를 전송하며 모두 UTF-8 로 처리했지만 어김없이 한글 깨짐 현상이 발생했습니다. 아마도 DB->java 데몬 으로 옮겨 오면서 UTF-8 처리가 제대로 되지 않은걸로 추측됩니다. 이문제에 대해서 해결한 방법을 아래에 적었습니다. java URLEncoder.encode("한글",.. 2022. 2. 17. ${} - EL 표현식 문법과 사용 방법 출처사이트 https://atoz-develop.tistory.com/entry/JSP-EL-%ED%91%9C%ED%98%84%EC%8B%9D-%EB%AC%B8%EB%B2%95%EA%B3%BC-%EC%82%AC%EC%9A%A9-%EB%B0%A9%EB%B2%95 JSP - EL 표현식 문법과 사용 방법 JSP - EL 표현식 문법과 사용 방법 EL(Expression Language)은 자바 빈의 프로퍼티, 값을 JSP의 표현식 이나 액션 태그 를 사용하는것 보다 쉽고 간결하게 꺼낼수 있게 하는 기술이다. 또한 static atoz-develop.tistory.com JSP - EL 표현식 문법과 사용 방법 EL(Expression Language)은 자바 빈의 프로퍼티, 값을 JSP의 표현식 이나 액션 .. 2022. 2. 17. 스프링 Filter 와 Listener 원본사이트 https://galid1.tistory.com/521?category=783055 SpringMVC - Spring MVC 동작원리 - 1 (Servlet의 Listener와 Filter) SpringMVC의 동작 원리 - 1 이제부터는 SpringMVC의 동작원리에 대해서 알아보는 시간을 가지며 포스팅을 할 예정입니다. 일반 java WebProject에서 부터 Spring MVC 프로젝트를 생성하기까지 천천히 알아보 galid1.tistory.com 이제부터는 SpringMVC의 동작원리에 대해서 알아보는 시간을 가지며 포스팅을 할 예정입니다. 일반 java WebProject에서 부터 Spring MVC 프로젝트를 생성하기까지 천천히 알아보면서 진행하겠습니다. 우선 SpringMVC의 .. 2022. 2. 16. 스프링 Bean의 개념과 Bean Scope 종류 원본사이트 https://cantcoding.tistory.com/47 스프링 Bean,Singleton,Bean Scope 스프링 빈(Spring Bean)이란? 스프링 IoC(Inversion of Control) 컨테이너에 의해서 관리되고 애플리케이션의 핵심을 이루는 객체들을 스프링 빈(Beans)이라고 한다. 빈은 스프링 컨테이너에 의해서 인스턴 cantcoding.tistory.com 스프링 빈(Spring Bean)이란? 스프링 IoC(Inversion of Control) 컨테이너에 의해서 관리되고 애플리케이션의 핵심을 이루는 자바객체들을스프링 빈(Beans)이라고 한다. 빈은 스프링 컨테이너에 의해서 인스턴스화 되어 조립되고 관리됩니다.스프링 컨테이너가 관리해준다는 점을 제외하면 일반 자바.. 2022. 2. 16. 스프링 필터 (필터와 인터셉터 차이점) 원본사이트 https://mangkyu.tistory.com/173 [Spring] 필터(Filter) vs 인터셉터(Interceptor) 차이 및 용도 Spring은 공통적으로 여러 작업을 처리함으로써 중복된 코드를 제거할 수 있도록 많은 기능들을 지원하고 있다. 이번에는 그 중에서 필터(Filter) vs 인터셉터(Interceptor)의 차이에 대해 알아보고자 mangkyu.tistory.com Spring은 공통적으로 여러 작업을 처리함으로써 중복된 코드를 제거할 수 있도록 많은 기능들을 지원하고 있다. 이번에는 그 중에서 필터(Filter) vs 인터셉터(Interceptor)의 차이에 대해 알아보고자 한다. 또한 간략하게 인터셉터(Interceptor)와 AOP(Aspect Oriented .. 2022. 2. 16. 스프링 Listener 원본글 https://dololak.tistory.com/616 [서블릿/JSP] 리스너(Listner)란? 이벤트 리스너의 개념 설명. 구현 및 등록하기 리스너란? 이벤트, 리스너, 이벤트핸들러 간략 개념정리 리스너는 단어의 뜻으로 보자면 (소리를) 듣는 사람, 청취자입니다. 프로그래밍에서의 리스너는 무언가 소리를 듣는 사람을 뜻하기 보다 dololak.tistory.com 리스너란? 이벤트, 리스너, 이벤트핸들러 간략 개념정리 리스너는 단어의 뜻으로 보자면 (소리를) 듣는 사람, 청취자입니다. 프로그래밍에서의 리스너는 무언가 소리를 듣는 사람을 뜻하기 보다는 특정 이벤트(특정한 사건)가 발생하기를 '귀 기울여' 기다리다가 실행되는 컴포넌트(메서드나 함수)를 말합니다. 리스너는 이벤트가 발생함과 동시에.. 2022. 2. 16. 스프링 Annotation 원본사이트 https://velog.io/@gillog/Spring-Annotation-%EC%A0%95%EB%A6%AC [Spring] Annotation 정리 Annotation(@)은 사전적 의미로는 주석이라는 뜻이다. 자바에서 사용될 때의 Annotation은 코드 사이에 주석처럼 쓰여서 특별한 의미, 기능을 수행하도록 하는 기술이다. velog.io Annotation 이란? Annotation(@)은 사전적 의미로는 주석이라는 뜻이다. 자바에서 Annotation은 코드 사이에 주석처럼 쓰이며 특별한 의미, 기능을 수행하도록 하는 기술이다. 즉, 프로그램에게 추가적인 정보를 제공해주는 메타데이터라고 볼 수 있다. meta data : 데이터를 위한 데이터) 다음은 어노테이션의 용도를 나타낸 것.. 2022. 2. 16. 스프링 AOP 원본사이트 : https://atoz-develop.tistory.com/entry/Spring-%EC%8A%A4%ED%94%84%EB%A7%81-AOP-%EA%B0%9C%EB%85%90-%EC%9D%B4%ED%95%B4-%EB%B0%8F-%EC%A0%81%EC%9A%A9-%EB%B0%A9%EB%B2%95?category=869240 [Spring] 스프링 AOP 개념 이해 및 적용 방법 [Spring] 스프링 AOP 개념 이해 및 적용 방법 1. AOP(Aspect Oriented Programming) Spring은 Spring Triangle이라고 부르는 세 가지 개념을 제공해준다. 각각 IoC, AOP, PSA를 일컫는다. AOP는 Aspect Ori.. atoz-develop.tistory.co.. 2022. 2. 16. 스프링 Intercepter 원본사이트: https://velog.io/@gillog/Spring-InterceptorHandlerInterceptor-HandlerInterceptorAdapter [Spring] Interceptor란? 구현 예제와 함께 (HandlerInterceptor, HandlerInterceptorAdapter) Interceptor Interceptor는 낚아채다의 의미를 가지고있다. Client에서 Server로 들어온 Request 객체를, Controller의 Handler로 도달하기 전 가로채어, 원하는 추가 작업이나 로직을 수행 한 후 Handler로 보낼 수 velog.io Interceptor Interceptor는 낚아채다의 의미를 가지고있다. Client에서 Server로 들어온 Req.. 2022. 2. 16. 스프링 AOP 개념 이해 및 적용 방법 원본사이트 : https://atoz-develop.tistory.com/entry/Spring-스프링-AOP-개념-이해-및-적용-방법?category=869240 [Spring] 스프링 AOP 개념 이해 및 적용 방법 [Spring] 스프링 AOP 개념 이해 및 적용 방법 1. AOP(Aspect Oriented Programming) Spring은 Spring Triangle이라고 부르는 세 가지 개념을 제공해준다. 각각 IoC, AOP, PSA를 일컫는다. AOP는 Aspect Ori.. atoz-develop.tistory.com [Spring] 스프링 AOP 개념 이해 및 적용 방법 1. AOP(Aspect Oriented Programming) Spring은 Spring Triangle이라고 .. 2022. 2. 16. 스프링 MVC 호출 순서와 기본 설정 방법 원본사이트 https://velog.io/@ehdrms2034/스프링-MVC-Spring-MVC-구조 스프링 MVC - Spring MVC 구조 및 예외처리 본 글은 스프링 MVC에 대해 지식을 정리하고 나중에 헷갈릴 때 다시 보기 위한 글입니다 👀본 게시글은 Spring MVC Quick Start를 참조하여 정리한 글입니다. 📖 👀본 게시글은 Spring MVC Documentation를 velog.io https://velog.io/@gillog/Spring-MVC-%EA%B5%AC%EC%A1%B0 Spring MVC 구조 스프링 MVC는 Model2 방식을 따르며 이 Model2의 아키텍처에 맞게 설계되어 있다. 스프링에서는 유저의 요청을 받는 DispathcerServlet이 핵심이다. velo.. 2022. 2. 16. 컨트롤 와 뷰간에 데이터 주고 받기(파라메터 종류) 2 원본사이트 https://admm.tistory.com/54 [Spring] 컨트롤러와 프론트 사이에서 값 전달하는 방법의 종류 [1] 들어가며 Spring 프레임워크의 컨트롤러와 JSP사이에서 값을 주고 받는 것은 웹프로그래밍에서 가장 기본적인 작업입니다. 하지만 값을 전달하는 방법의 종류가 많고 프레임워크특성상 많은 admm.tistory.com [1] 들어가며 Spring 프레임워크의 컨트롤러와 JSP사이에서 값을 주고 받는 것은 웹프로그래밍에서 가장 기본적인 작업입니다. 하지만 값을 전달하는 방법의 종류가 많고 프레임워크특성상 많은 부분이 자동화되어 지기 때문에 그 원리를 이해하지 못한채로 사용하다 보니 세팅이 조금 다른 프로젝트를 가거나 혹은 내용이 막혔을 때 응용하기가 어려운 부분이 있습니다... 2022. 2. 16. 컨트롤 와 뷰간에 데이터 주고 받기(파라메터 종류) 참고사이트 https://doing7.tistory.com/10 [Spring] Controller에서 데이터 받기 Controller은 비지니스 로직을 처리하고 데이터를 가공한다. 이때 비지니스 로직을 처리하기위해 controller에서 데이터를 받는 방법에 대해서 알아보자. 크게 HttpServletRequest, @RequestParam, @RequestBody,.. doing7.tistory.com Controller은 비지니스 로직을 처리하고 데이터를 가공한다. 이때 비지니스 로직을 처리하기위해 controller에서 데이터를 받는 방법에 대해서 알아보자. 크게 HttpServletRequest, @RequestParam, @RequestBody, @ModelAtrribute, @PathVari.. 2022. 2. 16. ajax 에서 배열을넘겨 JAVA 에서 확인 하기 ajax 에서 배열을넘겨 JAVA 에서 확인할수있다 traditional 옵션을 넣어주면 간단하게 되는거지만 대부분 삽질을 하게된다 1.javascript 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 var arr = ['aa', 'bb', 'cc']; $.ajax({ method : 'POST', url : 'test.do', traditional : true, data : { 'main' : arr }, success : function(data) { alert(data); }, error : function(request, status, error) { alert(error); } }); Colored by Color Scripter cs 2.JAVA 1 2 3 4 5.. 2021. 8. 12. javascript / ajax 배열 request 전송 및 java에서 받기 Java에서 배열 데이터 전송 받기 1. 전송 form PHP와는 다르게 input name에 배열표시 '[]'를 넣지 않아도 된다. 위와같은 데이터를 Controller에서 받을 경우 2. controller @Controller public class TestController { @RequestMapping(value = "/process.do") public String testMethod(HttpServletRequest request, Model model) { String[] arrayParam = request.getParameterValues("name"); for (int i = 0; i < arrayParam.length; i++) { System.out.println(arrayPar.. 2021. 8. 11. Selection 과 Range 사용자가 드래그 등으로 선택한 텍스트 및 위치 출처 : https://ohgyun.com/547 참고: https://developer.mozilla.org/en-US/docs/Web/API/Selection https://developer.mozilla.org/en-US/docs/Web/API/Range https://javascript.info/selection-range# Selection Selection 은 window.getSelection() 이나 다른 메서드의 호출로 생성되는 객체이다. 사용자가 드래그 등으로 여러 엘리먼트에 걸쳐 선택한 텍스트를 대표한다. window또는 document를 이용해서 갖어 올수 있다. function getSelection() { return (window.getSelection) ? window.get.. 2021. 8. 11. javascript Document - 노드 다루기 (찾기, 생성, 삭제) 문서에서 특정 태그 이름을 지닌 노드 찾기 - Document 객체의 getElementsByTagName()을 이용하면 전체 문서에서 매개변수 값의 엘리먼트를 찾을 수 있습니다. var divs = window.document.getElementsByTagName("div"); alert("문서내의 div 엘리먼트 개수 : " + divs.length); for (var i = 0; i < divs.length; i++) { var div = divs.item(i); div.style.border = "1px solid #ff0000"; } 특정노드의 자식노드에서 특정태그 이름을 지닌 노드 찾기 - 문서 전체가 아닌 특정 노드의 자식 가운데 특정 태그 이름을 가진 엘리먼트를 찾고 싶은 경우 Docume.. 2021. 8. 11. 요소 정렬 clear css 속성 출처 : https://electronic-moongchi.tistory.com/22 [css] clear(none, both, left, right) 의 속성 이전에 float 속성에 대해서 배웠는데, https://heavenlake.tistory.com/64 요소 영역, 정렬 float 출처 : https://electronic-moongchi.tistory.com/21?category=710947 [css] float(left, right, none) 의 속성 float 은 해당 요소를 어떻게 정렬할지를 정의하는 css 속성이다. 로 띄우거나 하지 마라... floa.. heavenlake.tistory.com float 은 왼쪽, 오른쪽으로 해당 객체를 위치 시켜서 정렬하는 속성이었다. 그렇다면.. 2021. 8. 5. 요소 영역, 정렬 float 출처 : https://electronic-moongchi.tistory.com/21?category=710947 [css] float(left, right, none) 의 속성 float 은 해당 요소를 어떻게 정렬할지를 정의하는 css 속성이다. 로 띄우거나 하지 마라... float 속성은 묶음 태그(block element) 만 적용할 수 있다. 묶음 태그 : 등 float 의 속성 사용법 none (기본값) : 정렬하지 않는다. left : 왼쪽으로 정렬한다. right: 오른쪽으로 정렬한다. 기본 html 소스 소스보기 실행 결과는 다음과 같다. 이제부터 위의 html 문서에서 float 속성을 적용해 보자. 1. float: none div { width: 100px; height: 100p.. 2021. 8. 5. 이전 1 2 3 4 다음 반응형
