`

dwr_刷新表格

    博客分类:
  • Ajax
 
阅读更多

dwr.xml文件

<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 1.0//EN" "http://www.getahead.ltd.uk/dwr/dwr10.dtd">  

<dwr>  

    <allow>  

        <create creator="spring" javascript="UnitManager"><!-- 由spring管理,直接访问serverce,构建一个UnitManager.js -->  

            <param name="beanName" value="unitManager" />  

            <include method="getAllList" /><!-- 可用方法-->  

        </create>  

       <convert converter="bean" match="com.bigner.unitModule.model.Unit">  <!-- 指定bean -->

            <param name="include" value="id,unitName,baseVal"></param><!--  取出指定参数 -->  

        </convert>  

    </allow>  

</dwr>

 

在jsp中创建一个table

<table>

<thead>

<tr>

<td>&nbsp;</td>

<td><fmt:message key="product.type"/><!-- 获取资源文件 -->

</td>

</tr>

</thead>

<tbody id="refreshBody"><!-- 在这刷新 -->

</tbody>

</table>

 

js 代码

<script type='text/javascript' src='/dwr/interface/UnitManager.js'></script>

<script type='text/javascript' src='/dwr/engine.js'></script>

<script type='text/javascript' src='/dwr/util.js'></script>

function selOtherUnit(){

   var sel = document.getElementById("unitInfo");

   UnitManager.getUnitList(setRefreshTable,sel.options[sel.selectedIndex].value); //根据unitInfo改变值,从数据库取得数据,返回值由setRefreshTable进行处理

}

function setRefreshTable(data){//data接受返回数据,这返回的是一个Unit对象

  if(data!="" && data!=null){

      DWRUtil.removeAllRows("refreshBody");//删除table的更新元素

      DWRUtil.addRows("refreshBody", data, [ getCheck,getUnitName ],//getCheck,getAllUnit是表的对应的列,

      {

         rowCreator:function(options) {//创建行,对其进行增添颜色

         var row = document.createElement("tr");

         var index = options.rowIndex * 50;

         row.style.color = "rgb(" + index + ",0,0)";

         return row;

         },

         cellCreator:function(options) {//创建单元格,对其进行增添颜色

         var td = document.createElement("td");

         var index = 255 - (options.rowIndex * 50);

         td.style.backgroundColor = "rgb(" + index + ",255,255)";

         td.style.fontWeight = "bold";

         return td;

         }

      });

  }else{

      DWRUtil.removeAllRows("refreshBody");

  }

}

var getCheck = function(unit) {

      return '<input type="radio" name="unitCheck" value='+unit.id+' onclick="readUnitId(this.value);" />';

};

var getUnitName = function(unit) { return unit.name };

 

到这就可以刷新动态刷新table, 与之相对应的刷新select方法是

DWRUtil.removeAllOptions("refreshSelect");  

DWRUtil.addOptions("refreshSelect", [" "]);  

DWRUtil.addOptions("refreshSelect", unit,"id","name");

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics