'자바 > JAVA...Spring' 카테고리의 다른 글
jQuery 사용 (0) | 2016.01.08 |
---|---|
JQUERY 특징 (0) | 2016.01.08 |
JavaScript Library 종류 (0) | 2016.01.07 |
JQuery 개요 (0) | 2016.01.07 |
[dynamicContent.xml] (0) | 2016.01.06 |
jQuery 사용 (0) | 2016.01.08 |
---|---|
JQUERY 특징 (0) | 2016.01.08 |
JavaScript Library 종류 (0) | 2016.01.07 |
JQuery 개요 (0) | 2016.01.07 |
[dynamicContent.xml] (0) | 2016.01.06 |
JQUERY 특징 (0) | 2016.01.08 |
---|---|
JQuery 다운로드 (0) | 2016.01.07 |
JQuery 개요 (0) | 2016.01.07 |
[dynamicContent.xml] (0) | 2016.01.06 |
[dynamicContent.html] (0) | 2016.01.06 |
- 2006년 초, John Resig가 만든 JavaScript Library
- JavaScript™와 Asynchronous JavaScript + XML (Ajax) 프로그래밍을 단순화 함
- DOM 스크립팅과 Ajax의 반복성을 단순하게
코드를 단순하고 간결하게 유지한다.
많은 반복 루프와 DOM 스크립팅 라이브러리 호출을 작성할 필요가 없다
JQuery 다운로드 (0) | 2016.01.07 |
---|---|
JavaScript Library 종류 (0) | 2016.01.07 |
[dynamicContent.xml] (0) | 2016.01.06 |
[dynamicContent.html] (0) | 2016.01.06 |
Spring 3.2 & MyBatis] 단순한 파일 업로드 (0) | 2016.01.05 |
<?xml version="1.0" encoding="utf-8"?>
<부서들>
<부서 code="insa" title="인사부">
<사원 position="과장">김과정</사원>
<사원 position="대리">김대리</사원>
<사원 position="사원">김사원</사원>
</부서>
<부서 code="sale" title="영업부">
<사원 position="부장">이부장</사원>
<사원 position="과장">이과장</사원>
<사원 position="대리">이대리</사원>
</부서>
</부서들>
JavaScript Library 종류 (0) | 2016.01.07 |
---|---|
JQuery 개요 (0) | 2016.01.07 |
[dynamicContent.html] (0) | 2016.01.06 |
Spring 3.2 & MyBatis] 단순한 파일 업로드 (0) | 2016.01.05 |
Spring 3.2 & MyBatis] 단순한 파일 업로드 (0) | 2016.01.05 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhmtl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
<title>페이지 내용을 동적으로 바꾸는 예제</title>
<script language="JavaScript">
<!--
var xmlHttp;
var requestType;
// XHR 객체를 생성한다.
function createXMLHttpRequest() {
if(window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} else if(window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
}
// 조회를 한다.
function doSearch() {
requestType = document.getElementById("부서").value;
createXMLHttpRequest();
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET", "dynamicContent.xml", true);
xmlHttp.send(null);
}
// 요청 처리 콜백 함수
function handleStateChange() {
if(xmlHttp.readyState == 4) {
if(xmlHttp.status == 200) {
clearPreviousResults();
parseResults();
}
}
}
// 이전 결과를 지운다.
function clearPreviousResults() {
var header = document.getElementById("header");
if(header.hasChildNodes()) {
header.removeChild(header.childNodes[0]);
}
var tableBody = document.getElementById("resultsBody");
while(tableBody.childNodes.length > 0) {
tableBody.removeChild(tableBody.childNodes[0]);
}
}
// 요청의 결과를 테이블 형태로 동적으로 출력한다.
function parseResults() {
var results = xmlHttp.responseXML;
var code = "";
var departmentName = "";
var position = "";
var name = "";
// 모든 사원노드를 배열로 가져옵니다.
var staffs = results.getElementsByTagName("사원");
for(var i = 0; i < staffs.length; i++) {
// 부모노드의 부서 코드를 가져옵니다.
code = staffs[i].parentNode.getAttribute("code");
// 부서를 선택했을 경우 코드가 다르면 건너뜁니다.
if(requestType != "all" && code != requestType) continue;
// 부서명, 직위, 이름 정보를 가져옵니다.
departmentName = staffs[i].parentNode.getAttribute("title");
position = staffs[i].getAttribute("position");
name = staffs[i].childNodes[0].nodeValue;
addTableRow(departmentName, position, name);
}
var header = document.createElement("h2");
var headerText = document.createTextNode("조회결과:");
header.appendChild(headerText);
document.getElementById("header").appendChild(header);
document.getElementById("resultsTable").setAttribute("border", "1");
}
// 테이블의 TR 엘리먼트를 주어진 내용으로 생성한다.
function addTableRow(departmentName, position, name) {
// 테이블 행 엘리먼트를 생성합니다.
var row = document.createElement("tr");
// 테이블 데이터 엘리먼트를 생성해서 추가합니다.
var cell = createCellWithText(departmentName);
row.appendChild(cell);
cell = createCellWithText(position);
row.appendChild(cell);
cell = createCellWithText(name);
row.appendChild(cell);
// 테이블에 행을 추가합니다.
document.getElementById("resultsBody").appendChild(row);
}
// 테이블의 TD 엘리먼트를 주어진 text 를 내용으로 하여 생성한다.
function createCellWithText(text) {
// 테이블 데이터 엘리먼트를 생성합니다.
var cell = document.createElement("td");
var textNode = document.createTextNode(text);
cell.appendChild(textNode);
return cell;
}
//-->
</script>
</head><body>
<h3>페이지 내용을 동적으로 바꾸는 예제</h3>
<h1>부서별 조회</h1>
<form action="#">
부서
<select id="부서">
<option value="all">전체</option>
<option value="sale">영업부</option>
<option value="insa">인사부</option>
</select>
<input type="button" value="Search" onclick="doSearch();"/>
</form>
<span id="header"></span>
<table id="resultsTable" width="500" border="0">
<tbody id="resultsBody">
</tbody>
</table></body></html>
JQuery 개요 (0) | 2016.01.07 |
---|---|
[dynamicContent.xml] (0) | 2016.01.06 |
Spring 3.2 & MyBatis] 단순한 파일 업로드 (0) | 2016.01.05 |
Spring 3.2 & MyBatis] 단순한 파일 업로드 (0) | 2016.01.05 |
컨텐츠를 동적으로 생성할 수 있게 해주는 W3C DOM 의 속성과 메소드 (0) | 2016.01.04 |
『 단순한 파일 업로드 』
<소스코드>
* 컨트롤러 작성
@Controller
@RequestMapping("/test/fileupload")
public class FileuploadController {
@RequestMapping(method=RequestMethod.GET)
public void setupForm(Model model) {
}
// 하나의 파일을 업로드함
@RequestMapping(value="single", method=RequestMethod.POST)
public ModelAndView doAction(@RequestParam("file") MultipartFile file) throws IllegalStateException, IOException {
if(!file.getOriginalFilename().isEmpty() && !file.isEmpty()) {
File uploadFile = new File("d:/upload/", file.getOriginalFilename());
//서버내의 다른 장소에 업로드함
file.transferTo(uploadFile);
ModelAndView mav = new ModelAndView("/test/complete");
mav.addObject("filename", file.getOriginalFilename());
mav.addObject("filesize", FileUtils.byteCountToDisplaySize(file.getSize()));
return mav;
} else {
ModelAndView mav = new ModelAndView("/test/fail");
return mav;
}
}
}
[dynamicContent.xml] (0) | 2016.01.06 |
---|---|
[dynamicContent.html] (0) | 2016.01.06 |
Spring 3.2 & MyBatis] 단순한 파일 업로드 (0) | 2016.01.05 |
컨텐츠를 동적으로 생성할 수 있게 해주는 W3C DOM 의 속성과 메소드 (0) | 2016.01.04 |
[parseXML.html] (0) | 2016.01.04 |
『 단순한 파일 업로드 』
<소스코드>
* JSP 작성
form속성에 enctype="multipart/form-data“ 추가
<h4>파일 업로드</h4>
<form action="${appUrl}/test/fileupload/single.html" method="post" enctype="multipart/form-data">
<input type="file" name="file" />
<input type="submit"/>
</form>
[dynamicContent.html] (0) | 2016.01.06 |
---|---|
Spring 3.2 & MyBatis] 단순한 파일 업로드 (0) | 2016.01.05 |
컨텐츠를 동적으로 생성할 수 있게 해주는 W3C DOM 의 속성과 메소드 (0) | 2016.01.04 |
[parseXML.html] (0) | 2016.01.04 |
XML 다큐먼트를 다루는 유용한 DOM 요소의 메소드 (0) | 2016.01.04 |
document.createElement(tagName) : tagName 으로된 엘리먼트를 생성한다. div 를 메소드 파라미터로 입력하면 div 엘리먼트가 생성된다.
document.createTextNode(text) : 정적 텍스트를 담고 있는 노드를 생성한다.
<element>.appendChild(childNode) : 특정 노드를 현재 엘리먼트의 자식 노드에 추가시킨다. (예를들어 select 엘리먼트에 option 엘리먼트 추가)
<element>.getAttribute(name) : 속성명이 name 인 속성값을 반환한다.
<element>.setAttribute(name, value) : 속성값 value 를 속성명이 name 인 곳에 저장한다.
<element>.insertBefore(newNode, tartgetNode) : newNode 를 tartgetNode 전에 삽입한다.
<element>.removeAttribute(name) : 엘리먼트에서 name 속성을 제거한다.
<element>.removeChild(childNode) : 자식 엘리먼트를 제거한다.
<element>.replaceChild(newNode, oldNode) : oldNode 를 newNode 로 치환한다.
<element>.hasChildNodes() : 자식 노드가 존재하는지 여부를 판단한다. 리턴형식은 Boolean 이다.
Spring 3.2 & MyBatis] 단순한 파일 업로드 (0) | 2016.01.05 |
---|---|
Spring 3.2 & MyBatis] 단순한 파일 업로드 (0) | 2016.01.05 |
[parseXML.html] (0) | 2016.01.04 |
XML 다큐먼트를 다루는 유용한 DOM 요소의 메소드 (0) | 2016.01.04 |
XML 문서를 처리하기 위한 DOM 요소의 속성 (0) | 2015.12.30 |