[Servlet&JSP] JSP 기본 태그[Servlet&JSP] JSP 기본 태그
Posted at 2020. 7. 27. 07:07 | Posted in JAVA/Servlet & JSP■ JSP 기본 태그
HTML이나 자바스크립트에 의해 작성된 페이지들은 그 페이지를 사용하는 사용자와 상관없이 항상 동일한 내용만을 제공해주는 정적 페이지이다.
하지만 웹 프로그램들은 사용자에 따라 서로 다른 내용이 제공되어야 하는데 이러한 동적 페이지를 구현하기 위해서는 다음과 같이 JSP 태그를 사용해야 한다.
종류 |
형식 |
사용 용도 |
스크립트릿( Scriptlet ) |
<% %> |
· 자바 코드를 기술함 |
선언( Declaration ) |
<%! %> |
· 변수와 메소드를 선언함 |
표현식( Expression ) |
<%= %> |
· 계산식이나 함수 호출한 결과를 문자열 형태로 출력함 |
주석( Comment ) |
<%-- --%> |
· JSP 페이지에 설명을 넣음 |
지시자( Directive ) | <%@ %> | · JSP 페이지의 속성을 지정함 |
■ 지시자
JSP 지시자( Directive )는 태그 안에서 @로 시작하며 Page, Include, Taglib 3가지 종류가 있다.
지시자는 클라이언틔 요청에 의해 JSP 페이지가 실행되면서 지시자에 언급된 설정을 JSP 페이지 전체에서 사용가능하도록 한다.
종류 |
사용 용도 |
Page |
· 해당 JSP 페이지 전반적으로 환경을 설정할 내용을 지정한다. |
Include |
· 현재 페이지에 다른 파일의 내용을 삽입할 경우 사용한다. |
Taglib |
· 태그 라이브러리에서 태그를 꺼내와 사용할 수 있는 기능을 제공한다. |
'JAVA > Servlet & JSP' 카테고리의 다른 글
| [Servlet&JSP] Eclipse 설치 및 Tomcat 설정하기 (0) | 2020.07.22 |
|---|---|
| [JSP & Servlet] Servlet과 JSP의 기초 개념 (0) | 2020.07.22 |
[jQuery] TextBox에서 다중 선택 기능 제작[jQuery] TextBox에서 다중 선택 기능 제작
Posted at 2020. 7. 24. 07:54 | Posted in JavaScript & jQuery/jQuery■ 텍스트 입력박스 다중 선택 기능 만들기
jQuery UI 중에는 다중 선택을 위한 Autocomplete - Multiple values 기능이 존재한다.
여러개의 항목중 원하는 몇가지를 선택하는것에 적합한데.
샘플코드( https://jqueryui.com/autocomplete/#multiple ) 를 보면 쉽게 알 수 있을 것이다.
그렇지만 위 샘플코드에서는 선택 입력한 값의 내용이 다시 선택이 가능하다는 단점이 존재하여.
한번 선택한 항목은 선택에서 배제될 수 있게 내용을 조금 수정해 보았다.
# 소스코드
<html lang="ko"> <head> <meta charset="utf-8"> <title>jQuery UI Autocomplete - 다중 선택</title> <link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script src="http://code.jquery.com/jquery-1.12.4.js"></script> <script src="http://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <script type="text/javascript"> jQuery(document).ready(function() { jQuery( "#tags" ).on( "keydown" , function( event ) { // 항목을 선택할때 탭으로 이동하지 못하게 한다. if( event.keyCode === jQuery.ui.keyCode.TAB && jQuery(this).autocomplete("instance").menu.active ) { event.preventDefault(); } }).autocomplete({ minLength : 0 , source : function( request, response ) { // Autocomplete 자동완성 문자 리스트 - 초기값 ( 변경되지 않는 절대값 ) const availableTags = [ "파이어폭스", "크롬", "오페라", "웨일", "사파리", "익스플로러", "엣지" , "비발디", "브레이브", "돌핀", "토치", "미도리", "아반트", "맥스톤" ]; // Autocomplete 자동완성 문자 리스트 - 변경값 ( 검색이 이루어지는 실제 배열의 삭제 및 재생산이 이루어짐 ) let unfoldTags = availableTags; // 콤마( , )로 구분되는 문자열을 배열로 만든다. let arrTrem = request.term.split(","); // 문자 리스트에서 이미 선택된 문자열은 삭제한다. arrTrem.forEach(function(trem) { let search = unfoldTags.indexOf( trem.trim() ); if(search != -1) { unfoldTags.splice(search, 1); } }); // 자동 완성을 다시 실행하지만, 마지막 용어를 추출한다. response(jQuery.ui.autocomplete.filter(unfoldTags, extractLast(request.term))); unfoldTags = null; } , focus : function() { return false; } , select : function(event, ui) { let terms = split(this.value); // 현재 입력값을 제거한다. terms.pop(); // 선택된 아이템을 추가한다. terms.push(ui.item.value); // 끝에 콤마와 공백을 추가한다. terms.push(""); this.value = terms.join(", "); return false; } }); // 공백문자에 대응 function split(val) { return val.split( /,\s*/ ); } // 배열의 마지막 요소를 제거한 후, 제거한 요소를 반환 function extractLast(term) { return split(term).pop(); } }); </script> </head> <body> <div class="ui-widget"> <label for="tags">프로그래밍 언어 : </label> <input id="tags" size="80" value=""> </div> </body> </html> |
# 출력결과
'JavaScript & jQuery > jQuery' 카테고리의 다른 글
| [jQuery] load( ) 메소드를 이용한 외부 데이터의 페이지 반영 (0) | 2020.03.02 |
|---|---|
| [jQuery] JCROP을 이용한 이미지 자르기 - Sample (5) | 2020.02.11 |
| [jQuery] jQuery Mobile을 이용한 반응형 테이블 제작 (0) | 2019.06.18 |
| [jQuery] 팝업 창 외에 다른 항목 클릭 막기 (0) | 2019.06.04 |
| [jQuery] 화면 단위로 끊어서 마우스 휠로 이동하기 (7) | 2019.01.31 |
[Servlet&JSP] Eclipse 설치 및 Tomcat 설정하기[Servlet&JSP] Eclipse 설치 및 Tomcat 설정하기
Posted at 2020. 7. 22. 15:20 | Posted in JAVA/Servlet & JSP■ Eclipse 설치하기
페이지에 접속하여 이클립스를 다운받는다.
Accept 버튼을 클릭하여 설정에 동의를 하고 설치를 계속 진행한다.
Apache Tomcat 설치 및 설정
Hello_World.jsp |
<%@ page language="java" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" %><!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here</title></head><body> <h1>Hello World ~ !!</h1></body></html> |
'JAVA > Servlet & JSP' 카테고리의 다른 글
| [Servlet&JSP] JSP 기본 태그 (0) | 2020.07.27 |
|---|---|
| [JSP & Servlet] Servlet과 JSP의 기초 개념 (0) | 2020.07.22 |
[JSP & Servlet] Servlet과 JSP의 기초 개념[JSP & Servlet] Servlet과 JSP의 기초 개념
Posted at 2020. 7. 22. 01:25 | Posted in JAVA/Servlet & JSP■ 서블릿과 JSP의 기초 개념
서블릿은 Server + Applet의 합성어로 서버에서 실행되는 Applet이란 의미로 자바를 이용하여 웹에서 실행되는 프로그램을 작성하는 기술을 말한다.
웹 애플리케이션을 제작하기 위해 제공되는 언어는 이미 언급한 PHP, ASP와 같이 많지만 요즘에 많은 기업에서는 JSP & Servlet을 사용하고 있다.
이는 다른 웹 기술에 비해 빠른 응답을 해 줄 수 있다는 장점이 있기 때문이다.
JSP & Servlet을 PHP 처럼 JSP라 하지 않고 JSP & Servlet이라고 한 이유는 독특한 탄생비화 때문이다.
서블릿은 자바 클래스 형태의 웹 어플리케이션을 말하는데, 브라우저를 통해 자바 클래스가 실행되도록 하기 위해서는
javax.servlet.http 패키지에서 제공하는 HttpServelt 클래스를 상속받아 구현해야 한다.
( HttpServlet 클래스를 상속 받아 만든 서브 클래스를 서블릿 클래스라고 한다. )
서블릿 또한 자바 프로그램의 다른 클래스들처럼 자바 가상머신인 JVM에서 동작하므로 클래스 파일이 생성되어야 하므로 클래스의 형태로 작성한다.
JDK에는 웹 애플리케이션을 제작할 수 있는 클래스가 제공되지 않고 톰캣을 설치하고 나면 웹 어플리케이션을 제작할 수 있는 클래스가 제공되지 않고
Tomcat을 설치하고 나면 웹 어플리케이션을 제작할 수 있는 클래스가 제공되는데, 그 클래스가 HttpServlet이다.
HttpServlet은 웹 서비스가 가능한 웹 어플리케이션을 제작할 수 있도록 자바를 확장해 놓은 클래스로 톰캣을 설치하면 제공된다.
( HttpServlet을 상속받은 클래스를 서블릿이라고 한다. )
이미 여러 기능들이 미리 만들어져 있기 때문에 개발자는 편리하게 HttpServlet을 활용하여 새로운 기능의 웹 프로그램을 만들 수 있는 것이다
'JAVA > Servlet & JSP' 카테고리의 다른 글
| [Servlet&JSP] JSP 기본 태그 (0) | 2020.07.27 |
|---|---|
| [Servlet&JSP] Eclipse 설치 및 Tomcat 설정하기 (0) | 2020.07.22 |
