How to modify this ajax suggestion

[freak12345]

please help me modify this script to make div scroll when using keyboard arrow up and down to selected the items.

 

var searchReq = open_xmlhttp();

function searchSuggest(CityName,StateName){

if(searchReq.readyState == 4 || searchReq.readyState == 0) {

var query = escape(document.getElementById('query_search').value);

var query_city = escape(CityName);

var query_state = escape(StateName);

nocache = Math.random();

searchReq.open('GET', 'index.php?<?php echo $visitorsid ?>=ajax_suggest_search&query='+query+'&city2='+query_city+'&state2='+query_state+'&nocache='+nocache);

searchReq.onreadystatechange = handleSearchSuggest;

searchReq.send(null);

}

}

function handleSearchSuggest(){

if(searchReq.readyState==4) {

var ssa = document.getElementById('sboxsuggest');

ssa.innerHTML = '';

var query = searchReq.responseText.split('\n');

if(query == '') {

document.getElementById('sboxassist').style.display = "none";

document.getElementById('sboxsuggest').style.display = "none";

document.getElementById('sboxscrollmain').style.display = "none";

document.getElementById('popupsmall_location').style.display = "none";

document.getElementById('popupsmall_login').style.display = "none";

} else {

document.getElementById('sboxscrollmain').style.display = "inline";

document.getElementById('sboxassist').style.display = "inline";

document.getElementById('sboxsuggest').style.display = "inline";

document.getElementById('popupsmall_location').style.display = "none";

document.getElementById('popupsmall_login').style.display = "none";

}

       

for(i=0; i < query.length-1; i++) {

I want to modify this part to be able to scroll and up down using arrow up and down to select the items.

                              var suggesta = '<div style="border: 3px solid gray" onmouseover="suggestOver(this);"';

suggesta += 'onmouseout="suggestOut(this);"';

suggesta += 'onclick="setSearch(this.innerHTML);"';

suggesta += 'class="sboxsuggest">'+query+'</div>';

ssa.innerHTML += suggesta;

}

} 

}

function suggestOver(div_value){

div_value.className = 'sboxsuggestlinkover';

}

function suggestOut(div_value){

div_value.className = 'sboxsuggestlink';

}

function setSearch(value){

document.getElementById('query_search').value = value;

document.getElementById('sboxassist').style.display = "none";

document.getElementById('sboxsuggest').style.display = "none";

document.getElementById('sboxscrollmain').style.display = "none";

document.getElementById('popupsmall_location').style.display = "none";

document.getElementById('popupsmall_login').style.display = "none";

}

[AE117]

scroll tho which selected items ... can you elaborate a bit