Bible, Lee, Data
Faith, software, data, and everyday life.
JSPAll posts
[JDBC] Ajax 구현: jQuery로 개량하여 구현
🍁jQuery로 개량하여 구현ajax 메서드$.ajax();jQuery 함수를 $로 적고, 바로 .을 찍으면 ajax 메서드가 나타난다.ajax는 태그와 관련된 기능이 아니라 독립적인 자바스크립트 기능이기 때문에 어떤 태그를 넣기가 애매하다. 독립적으로 ajax가 존재하도록 만들어야 하지만, 그냥 ajax();로 만들면 일반적인 함수인지 독립적인 함수인지 알 수 없기 때문에 앞에 jQuery를 붙여서 사용하는 것이다. success 이벤트ajax 메서드에는 페이지 요청 정보를 작성하며, 안전한 상황에서만 작업을 수행해야 한다. 그리고 onreadystatechange에서 readyState(4) + status(200)인 상황일 때 안전한 상황이라고 했는데, success: function(result..
[JDBC] Ajax 구현: 순수 자바스크립트로 구현
🍁순수 자바스크립트로 구현Ajax를 사용해서 서버로 데이터를 요청하고 응답받는 게 가능하다.이를 구현하기 위해서는 Ajax 객체를 먼저 만들어야 한다. Ajax 객체 생성const ajax = new XMLHttpRequest(); //서버와 데이터를 송수신(전화기)서버와 통신하는 Ajax 객체를 생성한다.이 객체가 전화기의 역할을 하여 서버와 송수신할 수 있게 된다. open, send 메서드//ajax.open('GET', '서버쪽 프로그램 주소');ajax.open('GET', '/ajax/ex02.txt');ajax.send();ajax에는 open이라는 메서드가 있다. 이때 form 태그의 GET과 open 메서드의 GET은 같다.서버와 통신을 하기 위해서 GET 방식으로 통신할지, POST ..
[JDBC] Ajax (Asynchronous JavaScript and XML)
🍁AjaxAjax는 비동기 방식으로 자바스크립트를 사용해서 서버와 데이터를 통신하는 기술을 의미하며, XML 형식으로 데이터를 주고받는다.화면 깜박임 없이 데이터를 주고받을 수 있는 기술이다. 서버 통신 요구사항 구현프로젝트 생성Dynamic Web Project: AjaxTestContextr oot: ajaxGenerate web.xml deployment descriptor 체크 com.test.ajax 패키지 생성1. com.test.ajax.controller 패키지DBUtil.javaEx01.javaEx01Data.java2. com.test.ajax.repository 패키지AjaxDAO.java3. com.test.ajax.model 패키지 WEB-INF 폴더1. WEB-INF > vie..
[JDBC] MVC Model (Model, View, Controller)
🍁Servlet + JSPServlet장점 : 자바 기반으로 자바 코드 용이하다.단점 : 클라이언트 코드가 불편하다. JSP장점 : 클라이언트 코드 용이하다.단점 : 자바 코드가 불편하다. Servlet + JSP 결론자바코드는 서블릿에 작성하고, 클라이언트 코드는 JSP에 작성한다. 🍁MVC ModelMVC 모델은 사용자 인터페이스, 데이터 및 논리 제어를 구현하는데 널리 사용되는 소프트웨어 디자인 패턴이다. Model데이터 처리, 오라클 DB처리를 한다. (자바) View출력담당, HTML페이지 생성한다. (JSP 페이지) Controller요청부터 응답까지 전체를 관리한다. (서블릿) 🍂JSP ModelJSP Model은 일반적으로 MVC모델을 따르며, 그중에서도 애플리케이션의 비즈니스 로직 ..
[JDBC] Todo List (CRUD 업무 구현)
🍁Todo List1. 주제Todo List2. 업무할일 쓰기할일 보기(목록)할일 수정하기할일 삭제하기3. DBTodo (script.sql)4. 화면(+페이지)할일 보기(목록) 페이지 (webapp > list.jsp)할일 쓰기 페이지 (webapp > add.jsp, addok.jsp)할일 수정 페이지 (webapp > editok.jsp)할일 삭제 페이지 (webapp > delok.jsp)템플릿 역할 (webapp > template.jsp)5. 리소스조각 페이지 (webapp > inc > header.jsp, asset.jsp)jQuery (webapp > js > jquery-1.12.js)6. WEB-INFlib > ojdb6.jar 복사구현 페이지할일 보기(목록) 페이지, 할일 쓰기 페..
[JSP] EL (Expression Language), JSTL (JSP Standard Tag Library)
🍁EL (Expression Language)EL과 JSTL을 사용하면 구문이 단순해지고, 가독성이 향상된다.이들은 서로 다른 기술이지만, 섞어서 사용한다.슬로건은 "JSP에서 되도록 자바를 쓰지 말자!"이다. EL 표현식의 사용${}Expression()과 EL 언어는 완전히 다른 것이지만, 이름이 같다는 점에서 목적이 같다는 것을 알 수 있다.EL 언어는 기능을 대신하기 위해서 만들어진 언어이다. EL 표현식 a: b: c: EL a: ${a} b: ${b} c: ${c} b: ${pageContext.getAttribute("b")} --%> c: ${request.getAttribute("c")} --%> 기존에 사용하던 표현식을 EL을 사용하여 바꿀 수 있다.그런데 어떤 ..
[JSP] 내장 객체의 생명주기 (scope)
🍁생명주기 내장 객체에 저장소를 제공하는데, pageContext, request, session, application 중에 어떤 것을 사용해야 하는지 의문이 생길 수 있다. 이때 내장 객체의 생명주기를 고려하면 된다.내가 저장하고 사용할 데이터를 어느 기간 동안 사용할지에 대해 결정하고, 내장 객체가 어느 기간 동안 객체가 유지되는지에 대한 생명주기를 고려하여 일치하는 것을 찾는다. ex19_scope_1: 데이터 입력 페이지ex19_scope_2: 데이터 수신 및 처리 페이지각 방법으로 데이터를 전달하는 과정을 살펴보면서 내장 객체의 생명주기에 대해 알아보도록 하자. ex19_scope_1 실패 int a = 10; /* 자바로 페이지 이동 */ //response.sendRedirect("ex1..
[JSP] 이미지 뷰어
🍁이미지 뷰어ex18.jsp: 이미지를 목록보기로 보여주는 뷰어 역할(메인, 목록 보기)ex18_ok.jsp: 이미지 업로드 처리ex18_del.jsp: 이미지 삭제 처리webapp에 "pic" 폴더를 생성했다. ex18.jsp() { public int compare(File o1, File o2) { return o1.getName().equals(o2.getName()); } }); */ Arrays.sort(list, (o1, o2) -> o2.getName().compareTo(o1.getName()));%> Image Viewer "> ');">× 이미지 ex18_ok.jsp ex18_del.js..
