Dev 133

Ajax - 검색시 제시어 기능 만들기

일반적인 검색엔진을 사용할 때, 사용자가 검색한 단어를 DB에 누적시켜 저장시킨 뒤 검색빈도가 높은 목록을 정리해서 출력해준다. 이 제시어 기능을 구현해보자. ① 검색어를 입력할 페이지 - suggestClient.jsp 제시어 .suggest{ display: none; position: absolute; left:11px; top:131px; } function sendKeyword(){ var userKeyword = document.myForm.userKeyword.value; if(userKeyword==""){ hide();//검색창이 비워져있으면 숨김 return; } var params = "userKeyword="+userKeyword; sendRequest("suggestClient_o..

Dev/JS & Jquery 2019.04.02

Ajax - get/post방식,Id유효성검사,서버/클라이언트 시간확인,CSV형식 데이터 읽기

1. Javascript를 통한 ajax 구현 ① helloAjax.jsp - 요청 전송 페이지 Insert title here var XMLHttpRequest; function ajaxRequest(){ XMLHttpRequest = createXMLHttpRequest();//객체 생성 XMLHttpRequest.open("GET","helloAjax_ok.jsp",true); //요청을 초기화하면서 요청 방식, 주소, 동기화 여부를 지정. XMLHttpRequest.onreadystatechange = viewMessage; //Callback함수 XMLHttpRequest.send(null);//요청을 보낸다. } function viewMessage(){ var responseText = XM..

Dev/JS & Jquery 2019.04.01

Ajax - 텍스트 데이터 전송받기

JavaScript & Ajax & JQuery 자바스크립트와 jQuery를 이용해서 Ajax를 구현하는 간단한 페이지를 실습해보고자 한다. JavaScript 사용예제 - test1.jsp, ajaxUtil.js, test1_ok.jsp JavaScript를 이용하여 서버로 보내는 HTTP request를 만들기 위해서는 그에 맞는 기능을 제공하는 Object의 인스턴스가 필요하다. XMLHttpRequest 객체 생성 var xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");//IE5.0이후에 나온 브라우저 var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");//IE5.0이전 var xmlHttp = new XMLHttpReq..

Dev/JS & Jquery 2019.03.29

JQuery 셋팅 및 예제

JQuery - 셋팅 Jquery는 엘리먼트를 선택하는 강력한 방법과 선택된 엘리먼트들을 효율적으로 제어할 수 있는 다양한 수단을 제공하는 자바스크립트 라이브러리. 두가지로 나뉘어져 있음. Script 파트와 GUI파트. GUI 환경은 굉장히 만들기 쉬움. Script를 통해서 Ajax를 활용하므로 기본적으로 이해를 해줘야한다. 이 모든것을 합쳐놓은게 Bootstrap https://jquery.com/ 에서 download JQuery 클릭 compressed 와 upcompressed 는 공백 여부 차이 커스텀 다운로드 클릭 1.12.1 다운로드 min파일은 공백이 없음. 그걸 제외하고는 동일한 내용의 파일 WebContent 폴더에 data폴더 생성 jQuery의 스크립트 부분을 jquery-3.3..

Dev/JS & Jquery 2019.03.29

Ajax란

Ajax Asynchronous JavaScript + XML의약어. 비동기식. 서버와 통신하기 위해서 XMLHttpRequest 객체를 사용한다. 일반 텍스트 형식, JSON, XML,HTML 등 다양한 포맷을 주고받을 수 있다. Ajax는 새로운 언어도 기술도 아니며 현존하는 웹프로그래밍 관련 기술(JavaScript, HTML, CSS, XHTML, XML, DOM, XMLHttpRequest 등 - XML, HTML은 DOM객체)들을 통합하여 대화형 웹애플리케이션을 개발하는 새로운 개발 방법(패러다임)이다. 비동기 웹 기술의 가장 큰 장점은 비동기적으로 작업을 수행함으로써 페이지 일부만을 변경할 수 있다는 것이다. 이러한 비동기성을 통해서 특정 Event 발생시 전체 페이지가 아닌 일부분만을 업데..

Dev/JS & Jquery 2019.03.29

Struts2/Spring2.5/iBatis 셋팅

JDK7 설치이때, 자바 JDK 버전이 7 이었음. 현재 PC 설치한 JDK는 버전 8JDK8은 어노테이션 인식이 안되므로 JDK7 설치를 하고자한다.설치되는 위치가 다르기 떄문에 충돌은 일어나지 않음 64비트와 32비트 차이로 인해 저장위치 다름 서버 환경설정 변경1. Runtime Environment 클릭2. Installed JREs 클릭3. Standard VM 클릭4. ADD JRE의 Directory 클릭5. JRE7이 설치된 경로 ▶ 확인 ▶ finish6. JRE7으로 설정 변경 7. 디폴트 설정을 'jre7'로 변경 ▶ finish8. 프로젝트 마우스 우클릭 ▶ properties ▶ Java Compiler ▶ Compiler Compliance level 1.7로 변경 9. 객체생성..

Dev/Struts 2019.03.28

Spring2.5 - 제어의역전,의존성주입 예제

의존성 주입 (Dependency Injection) 클래스 설계에서 주요 고려 사항중 하나는 객체 간 의존성을 제거해서 변경사항에 유연하게 대처하도록 구성하는 것이다. 의존성을 제거하는 클래스 구현방법으로 각 클래스가 인터페이스를 기반으로 호출하게 하고, 의존성 주입을 통해 객체 생성을 추상화하는 방법이 있다. Dependency Injection : 스프링은 객체의 의존성을 의존성 주입을 통해 관리한다. 의존성 주입 방법은 생성자 기반(Constructor Injection), 세터 기반(Setter Injection) 의존성 주입이 있다. DI는 Spring 프레임워크에서 새롭게 지원하는 IoC의 한 형태로 각 클래스사이의 의존관계를 빈 설정(Bean Definition) 정보를 바탕으로 컨테이너가..

Dev/Spring 2019.03.28

Spring2.5 - 개요 & 구성요소 & MVC패턴

스프링 개요 자바 엔터프라이즈 개발의 효율성을 높이는 오픈소스 경량 애플리케이션 프레임워크. 말 그대로 소스코드가 굉장히 간략해지고 가벼워졌다. EJB는 유일한 엔터프라이즈 애플리케이션 개발 프레임워크였는데 너무 어려워서 개발생산성이 뛰어난 스프링이 나왔다. 스프링2.5와 3.0에서 객체 지향과 의존성 주입(IoC 제어의역전 /DI 의존성주입) 문법을 두 버전 모두 실습하고자 한다. 핵심 도구 ① 객체 지향과 의존성 주입(IoC/DI) ② AOP : 테스트를 할때 어디까지 정상처리가 되고 오류가 나는지 도와줌. 굉장히 어렵다. POJO 프레임워크 (비침투적 프레임워크) ① 순수 자바로 프로그래밍할 수 있다.(자바 콘솔 프로그램도 만들수있음) ② POJO는 순수 자바클래스로 EJB(EJB 3.0 이전)나,..

Dev/Spring 2019.03.28

Struts2 - tiles

Tiles 페이지 레이아웃을 위한 프레임워크. 스프링에서도 제공한다. 요새는 부트스트랩을 사용해서 틀을 가져다가 쓴다. 뜯어보면 다 tiles 를 사용하는 것이다. 반복적으로 사용되는 header와 footer를 매 페이지마다 include를 시키게 되면 나중에 그 파일이 변경되었을 때 오류가 발생할 수 있다. 이를 예방하기 위해 Tiles는 레이아웃을 지원해준다. 1. 클라이언트의 요청을 받아 컨트롤러가 어떤 Action의 메소드로 가야할지 알려준다. 2. 이 때, Action의 실행전/후 모두 Interceptor를 거치게 된다(filter와 같은 역할). 3. Action은 실행 후 결과를 반환하는데 Result type=”tiles”로 가라고 알려준다. 4. Interceptor에서 Plugin인..

Dev/Struts 2019.03.28

Struts2/iBatis - 이미지 게시판 구현

주요 기능1. 로그인해야 게시물등록2. 페이징처리3. 게시물번호 일렬번호만들기4. 삭제는 업로드시킨 사람만 삭제가능1. DB에 테이블 만들기2. sqlMapConfig 등록3. sqlMap 생성insert into mem (userId,userPwd,userName,userBirth,userTel)values (#userId#,#userPwd#,#userName#,#userBirth#,#userTel#)select userId,userPwd,userName,to_char(userBirth,'yyyy-mm-dd') userBirth,userTelfrom mem where userId=#userId#select userId,userPwd,userName,to_char(userBirth,'yyyy-mm-dd'..

Dev/Struts 2019.03.26
반응형