인생 데이터베이스

Spring/Spring Web

[Spring] Spring과 Ajax연결하기

1. 먼저, Spring에서 Ajax를 사용하기 위해 pom.xml에 json dependecny를 추가해준다.(*사용하고자 하는 version이 다를 수 있음) com.googlecode.json-simple json-simple 1.1.1 2. jsp에서 원하는 곳에 $.ajax로 AJAX 프론트 로직을 구현한다. $(function(){ $("#phone").on("keyup",function(){ let phone = $(this).val(); if(phone.length 0) { // 중복 존재 return "fail"; }else { return "ok"; } // @ReponseBody // 클라이언트에서 서버로 필요한 데이터를 전송하기 위해서 JSON이라는 데이터를 요청 본문에 담아서 서버..

Spring/Spring Web

[Spring] index.jsp를 WEB-INF/views 안에 넣고 DispatcherServlet을 거치지 않고 띄우기. welcom-file 추가

// 원래 라면 webapp 폴더 하위에 index.jsp를 넣고 Tomcat Server의 web.xml의// welcom-file에 의하여 index.jsp를 첫 화면으로 띄울 수 있었다. index.html index.htm index.jsp // 하지만 프로젝트 내의 web.xml의 url-pattern이 /이 아닌 *.do같은 형식이라면, // Spring Legacy MVC에서 기본적으로 제공하는 HomeController에서 value="/"가// 작동하지 못하게 되며, // WEB-INF 내부에 넣을 시, Tomcat Server의 welcome-file이 찾지 못하게 되고,// 결국 index.jsp로 매핑되는 @RequestMapping이 없기 때문에 404에러가 뜬다. // 하지만 프..

Spring/Spring Web

[Spring] web.xml / servlet-context.xml의 path 분석

// 1. web.xml의 DispactherServlet에서 servlet-context.xml로 보낸다. appServlet org.springframework.web.servlet.DispatcherServlet contextConfigLocation /WEB-INF/spring/appServlet/servlet-context.xml 1 // 2. servlet-context.xml의 등록된 beans에서 Controller에서 넘어온 String 값에 // prefix:접두사, suffix:접미사 를 붙여서, // ${rootContext}/WEB-INF/views/ + 넘어온 String + .jsp 가 되어 // 페이지 이동을 할 수 있게 되는 것이다. // 기본적으로 WEB-INF에 직접 접..

Programming/자바스크립트

[JavaScript / JQuery]event객체 받아오기.

** JavaScript 이벤트 객체 const a = function(param){ console.log(param); } // JavaScript에서는 파라미터로 event를 넘겨주게 되면, // 현재 해당하는 event에 대한 객체 정보를 얻어올 수 있게 된다. // 출력 결과 // 또한, this와 함수명으로, 파라미터로 정보를 얻어올 수 있게 된다. 이벤트 객체 const a = function(param, param2, param3){ console.log(param); console.log(param2); console.log(param3); } // 출력 결과 ** JQuery 이벤트 객체 $("button").click(function(e){ console.log(e); // event객..

Programming/자바스크립트

[JavaScript/JQuery]키보드 입력, 마우스 클릭을[A.K.A 이벤트] 막고 싶을 때, event.preventDefault(); / e.preventDefault();

123456// enter 키 이벤트$(document).on('keydown', 'textarea', function(e){ if(e.keyCode == 13) { e.preventDefault(); // 엔터키가 입력되는 것을 막아준다. }});Colored by Color Scriptercs

Programming/자바스크립트

[JavaScript/JQuery] append(), appendTo()로 추가한 요소에 script 이벤트가 작동하지 않을 때

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 $("#abc").append(" click "); $('#test').click(function(){ alert('a'); }); 동적으로 append 한 요소에 이벤트를 걸어도 DOM Tree 구조에서는 새로 작성된 div#test를 찾지 못하여, 이벤트 바인딩에 실패하게 됩니다. $(document).on("click","#test",function(){ alert('a'); /* $(document).on("이벤트","선택자",함수(){}); id가 test인 태그를 click했을 때 function(){} 중괄호 안..