基于DWR的Ajax Suggest

java 代码

package
 ajax.dwr.suggest;

import
 java.util.ArrayList;
import
 java.util.List;

public
 
class
 SuggestAction {
    
public
 List findSuggest() {
        List list = 
new
 ArrayList();
        
for
 (
int
 i = 
0
; i < 
10
; i++) {
            Suggest suggest = 
new
 Suggest();
            suggest.setValue(String.valueOf(System.currentTimeMillis() + i));
            
//list.add(suggest.getValue());
            list.add(suggest);
        }
        
return
 list;
    }
}

java 代码

package
 ajax.dwr.suggest;

public
 
class
 Suggest {
    
private
 String value;

    
public
 String getValue() {
        
return
 value;
    }

    
public
 
void
 setValue(String value) {
        
this
.value = value;
    }
}

js 代码

<style type=
"text/css"
>
.mouseOut {
background: #708090;
color: #FFFAFA;
}
.mouseOver {
background: #FFFAFA;
color: #000000;
}
</style>
  <script language=
"javaScript"
 src=
"<%=request.getContextPath()%>/dwr/interface/SuggestAction.js"
></script>
  <script type='text/javascript' src='/dwr/engine.js'></script>
  <script type='text/javascript' src='/dwr/util.js'></script>
<script>
  
var
 value = 
function
(unit) {
return
 unit.value };

 
function
 suggest() {
    SuggestAction.findSuggest(loadSuggest);
  }

 
function
 loadSuggest(items)
 {
    setOffsets();
    DWRUtil.removeAllRows(
"suggest_table"
);
    DWRUtil.addRows(
"suggest_table"
,items,cellFunctions);
 }

 
var
 cellFunctions = [
  
function
(item) {
    
var
 cell = document.createElement(
"a"
);
    cell.setAttribute(
"href"
,
"#"
);
    cell.style.color=
"black"
;
    
var
 txtNode = document.createTextNode(item.value);
    cell.appendChild(txtNode);
    cell.onmouseout = 
function
() {
this
.className='mouseOver';};
    cell.onmouseover = 
function
() {
this
.className='mouseOut';};
    cell.onclick = 
function
() { populateName(
this
); } ;
    
return
 cell;
  }
];

function
 setOffsets() {
    
var
 inputField = document.getElementById(
"suggest_button"
);
    
var
 end = inputField.offsetWidth;
    
var
 left = calculateOffsetLeft(inputField);
    
var
 top = calculateOffsetTop(inputField) + inputField.offsetHeight;
    popup.style.border = 
"black 1px solid"
;
    popup.style.left = left + 
"px"
;
    popup.style.top = top + 
"px"
;
    suggest_table.style.width = end + 
"px"
;
}

function
 calculateOffsetLeft(field) {
    
return
 calculateOffset(field, 
"offsetLeft"
);
}

function
 calculateOffsetTop(field) {
    
return
 calculateOffset(field, 
"offsetTop"
);
}

function
 calculateOffset(field, attr) {
    
var
 offset = 0;
    
while
(field) {
        offset += field[attr];
        field = field.offsetParent;
    }
    
return
 offset;
}

 
function
 populateName(cell)
 {
    DWRUtil.removeAllRows(
"suggest_table"
);
    document.getElementById(
"inputField"
).value = cell.firstChild.nodeValue;
 }



</script>