<%@ page contentType="text/html; charset=EUC-KR"%>
<html>
<head>
<title>autoComplete</title>
<script type="text/javascript" src="ajax.js"></script>
<script>
var div;
var table;
var text;
/*
* 변수값 초기화
*/
function onLoad(){
div = document.getElementById("autoCompleteDiv");
table = document.getElementById("autoCompleteTable");
text = document.getElementById("autoCompleteText");
}
/*
* 조회
*/
function listAutoComplete(){
if(text.value != ""){
if(event.keyCode != 229){
var url = "autoComplete.action?word=" + text.value;
AutoComplete.ContentLoader(url, viewTitleList);
}
}else{
clearTitleList();
}
}
/*
* 테이블을 DHTML로 작성
*/
function viewTitleList(){
clearTitleList();
if(AutoComplete.getState()){ //데이터의 전부를 받은 상태
var tr, td;
var words = xmlHttp.responseXML.getElementsByTagName("word");
var size = words.length;
for(var i = 0 ; i < size ; i++){
tr = table.insertRow();
tr.style.width = "100%“;
td = tr.insertCell();
td.style.width = "100%";
td.style.cursor = "hand";
td.innerText = words[i].firstChild.nodeValue;
td.onclick = function() { wordClick(this);};
td.onmouseover = function() { mouseOver(this);};
td.onmouseout = function() { mouseout(this);};
}
}
}
/*
* 테이블의 목록을 초기화
*/
function clearTitleList(){
var ind = table.rows.length;
for (var i = ind - 1; i >= 0 ; i--) {
table.deleteRow(i);
}
}
/*
* 클릭시
*/
function wordClick(oTd){
text.value = oTd.innerText;
}
/*
* 마우스오버
*/
function mouseOver(td){
td.style.background= "#CBE7BA“;
}
/*
* 마우스아웃
*/
function mouseout(td){
td.style.background= "#FFFFFF“;
}
</script>
</head>
<body onLoad="onLoad()">
<input type="text" id="autoCompleteText" style="width:200px" autocomplete="off" onkeyup="javascript:listAutoComplete()"><br>
<div id="autoCompleteDiv" style="position:absolute; width:200px; height:180px; scrolling:yes; overflow-y:auto;">
<table id="autoCompleteTable" style="width:100%"></table>
</div>
</body>
</html>
'자바 > JAVA...Spring' 카테고리의 다른 글
| Spring 3.2 & MyBatis] 수치형 바인드 처리 (controller 작성) (0) | 2015.12.23 |
|---|---|
| Spring 3.2 & MyBatis] 수치형 바인드 처리 (command 클래스 작성) (0) | 2015.12.23 |
| [/WEB-INF/src/web/ajax/AjaxAction.java] (0) | 2015.12.23 |
| [/WEB-INF/src/log4j.xml] (0) | 2015.12.23 |
| Spring 3.2 & MyBatis] 날짜형 바인드 (에러 메시지 정의) (0) | 2015.12.22 |