DWRUtil提供的方法

DWR是ajax的一种框架，配置简单且提供了很多封装好的方法用于dom操作，除非非常复杂的功能我们需要使用原生态的javascript来实现。

下面给一个很常用的小例子（获取所有的省的名称并填充到option标签中）：

js代码：

function getProvince()
{

var data={“河南”,”河北”,”…”}
if (typeof window['DWRUtil'] == 'undefined')
{
  window.DWRUtil = dwr.util;
}
DWRUtil.removeAllOptions("provinceselect")
DWRUtil.addOptions("provinceselect",data);
}

说明：provinceselect是selectid；

下面列举一下DWRUtil中提供的方法：

$();

功能:相当于document.getElementById(id);

参数: id或name属性值;

例:

<input type=”text” name=”txt_test”></input>

<script>

       Var ele=$(txt_test);

       Var str=DWRUtil.toDescriptiveString(ele,1)

       DWRUtil.debug(str);

</script>

DWRUtil.getValue();

功能:获得指定元素value值

参数: id或name属性值;

注意:该函数只能用于有value属性的元素

例:

<input type=”text” name=”txt_test”></input>

<script>

       var val=DWRUtil.getValue(“txt_test”);

       DWRUtil.debug(val);

</script>

DWRUtil.getValues();

功能:获得一组指定元素的value值;

参数:id或name构成的数组对象

例:

<input type=”text” name=”txt_name” value=”wiley”></input>

<input type=”text” name=”txt_pswd” value=”wiley”></input>

<script>

       Var arr_=DWRUtil.getValues({“txt_name”:null,”txt_pswd”:null});

       Var str=DWRUtil.toDescriptiveString(arr,1)

       DWRUtil.debug(str);

</script>

DWRUtil.setValue();

功能:设置指定元素的value值

参数: id或name属性值

<input type=”text” name=”txt_test” value=””></input>

<script>

       DWRUtil.setValue(“txt_test”,”wiley”);

</script>

DWRUtil.setValues();

功能:设置一组指定元素的值

参数: id或name构成的数组对象

例:

<input type=”text” name=”txt_name” value=””></input>

<input type=”text” name=”txt_pswd” value=””></input>

<script>

       DWRUtil.setValues({“txt_name”:”wiley”,”txt_pswd”:”wiley”});

</script>

DWRUtil.getText();

功能:获得select元素的文本值

参数: id或name属性值

例:

<select name=”sel_test”>

       <option value=” wiley-cn.com” selected>wiley中国</option>

</select>

<script>

       Var txt=DWRUtil.getText (“sel_test”);

       Var val=DWRUtil.getValue(“sel_test”);

       DWRUtil.debug(“Text:”+txt+”\tValue:”+val);

</script>

DWRUtil.addRows();

功能:指定表格添加行

格式:DWRUtil.addRows(id,items, functions);

参数:

第一个参数:table或tbody的id属性值

第二个参数:数组或链表(可能用词不是很适合)

第三个参数:函数链表

例1:

<table>

       <tr>

              <td>主题</td>

       <tr>

       <tbody id=”tby_test”>

</tbody>

</table>

<script>

       Var arr_={“wiley’s blog”,”wiley中国”};

       DWRUtil.addRows(“tby_test”,arr_,[function(arr_){return arr_}]);

</script>

例2:

<table>

       <tr>

              <td>名称</td>

              <td>网址</td>

       <tr>

       <tbody id=”tby_test”>

</tbody>

</table>

<script>

       Var items=[{“name”:”wiley中国”,”add”:”wiley-cn.com”}];

       DWRUtil.addRows(“tby_test”,items,[function(item){return item.name}, function(item){return item.add}]);

</script>

DWRUtil.romoveAllRows();

功能:删除指定表格行

参数:table或tbody的id属性值

例

<table>

       <tr>

              <td>名称</td>

              <td>网址</td>

       <tr>

       <tbody id=”tby_test”>

</tbody>

</table>

<script>

       DWRUtil.romoveAllRows(“tby_test”);//每次添加前将原有数据行删除,防止数据重叠

       Var items=[{“name”:”wiley中国”,”add”:”wiley-cn.com”}];

       DWRUtil.addRows(“tby_test”,items,[function(item){return item.name}, function(item){return item.add}]);

</script>

DWRUtil.addOptions();

功能:添加select元素的option子元素

格式:DWRUtil.addOption(id,items)或DWRUtil.addOption(id,items,valueProp,textProp);

参数:

第一个参数:select的id或name属性值

第二个参数:数组或链表(填充数据)

第三、四个参数:链表节点的属性,第三个填充value值，第四个填充text值

例：

<select name=”sel_test”>

</select>

<script>

       Var arr_={“wiley”,”wiley中国”};

       DWRUtil.addRows(“sel_test”,arr_);//此时value与text值相同

       DWRUtil.romoveAllOptions(“sel_test”);

       Var items=[{“name”:”wiley中国”,”add”:”wiley-cn.com”}];

       DWRUtil.addRows(“sel_test”,”add”,”name”);//此时value与text不相同

</script>

DWRUtil.romoveAllOptions();

功能:删除指定select元素的option子元素

参数:select元素的id或name属性值

例:前面例子有用到

DWRUtil.debug();

功能:等价于alert()

例:前面例子有用到

DWRUtil.toDescriptiveString();

功能:将对象序列化成字符串,主要用于调试