只爱一次

不留遗憾

AJAX快速应用体验

         AJAX作为一种创建全新的用户体验技术组合,目前已有一些开源的实现,在经过技术研究和试用以后,感觉Buffalo和DWR比较方面,能快速上手,两者结合起来使用就更加灵活了。
      再结合两者使用时,建议使用DWR用作与服务器的交互,而将Buffalo提供的JavaScript对象用作回调函数处理DWR返回的结果。
      关于Buffalo和DWR的使用,请参看作者其他文章。
 举例如下,我要使两各下拉框连动,一个下拉框的内容是省份,另一个的是城市,后台获取城市的类为Demo,获取城市的方法为getCities(String),则代码如下:

< head >
< title >测试 </ title >
< link href = " <%=styleSheet%> "  rel = " stylesheet "  type = " text/css " >
< script src = " <%=webapp%>/common/scripts/validate.js " ></ script >
< script language = " JavaScript "  src = " <%=webapp%>/common/scripts/prototype.js " ></ script >
< script language = " JavaScript "  src = " <%=webapp%>/common/scripts/buffalo.js " ></ script >
< script language = " JavaScript "  src = " <%=webapp%>/common/scripts/template.js " ></ script >
< script src = " <%=webapp%>/dwr/engine.js "   ></ script >
< script src = " <%=webapp%>/dwr/interface/Demo.js " ></ script >

< script  >
    function changeCities(province)
    
{
        Buffalo.Bind.bind(
" city " , categories);
    }

    function changeProvince(province)
    
{
        Demo.getCities(province,changeCities);
    }

    
</ script >

</ head >
< body >
< form name = " test " >
< table  width = " 95% "  border = " 0 "  align = " center "  cellpadding = " 0 "  cellspacing = " 0 " >
  
< tr  class = " list " >
      
< td >
          省份:
      
</ td >
      
< td width = " 70% "  nowrap   >
          
< select name = " province "  id = " provinde "  onchange = " changeProvince(this.value) " >
           
< option value = "" >- 请省份 -</ option >
           
< option  > 湖北 </ option >        
</ select >
        
</ td >
     
</ tr >
     
< tr  >
        
< td width = " 30% "  nowrap  >
           城市
        
</ td >
        
< td width = " 70% "  nowrap  >
            
< select name = " city "  id = " city " ></ select >
        
</ td >
     
</ tr >
</ table >

</ html:form >

</ body >

posted on 2006-03-22 13:11 onlylife 阅读(711) 评论(0)  编辑  收藏 所属分类: Web技术


只有注册用户登录后才能发表评论。


网站导航: