您现在的位置: 365建站网 > 365文章 > 用JS(JavaScript)来进行对Struts的Html:checkbox或者html:multibox进行全选、及

用JS(JavaScript)来进行对Struts的Html:checkbox或者html:multibox进行全选、及

文章来源:365jz.com     点击数:1636    更新时间:2009-10-14 10:50   参与评论

 最近在开发项目的时候,要求实现对地市的权限选择,使用checkbox进行实现。

于是在网上先找了一下关于Struts对于html:checkbox进行的各种控制,可是很失望,网上说的无非都是
使用各种隐藏域来进行赋值或者控制的,而且在使用js对checkbox的状态判断的时候,采用的方法都很麻烦,这里就不一一列举了。

进入正题;

开始的时候发现html:checkbox下没有checked属性,当然对于它的name和id属性还是由于已经发生实质意义上的转变而不能采用getElementById来进行获取。所以一度陷入低谷。

在网上找来找去也没找到满意答案。于是还是自己动手亲自来操作。

静下来仔细一想,发现其实不管jsp页面是由Struts标签来写还是有JSTL来写,最后都是先要生成一个html页面。所以这样就好办了,因为我们的 “全选” 和 “全不选” 都是在html页面生成之后才进行控制的,所以这个时候只要关心已生成的HTML页面中存在的标签并对其进行控制即可。

所以可以用下面的方法进行html:checkbox或者html:multibox的全选控制:
-----------------------------------------------


 jsp部分代码:

<input type="checkbox" name="checkall" onclick="checkAll();" value="checkall">全选<br>
     
<logic:iterate id="city" name="citylist">
      <html:multibox   property="Area" ><bean:write name="city" property="cityID"/></html:multibox><bean:write name="city" property="cityName"/>

</logic:iterate>
-----------------------------------------------
其中
citylist从action中获取:

对应action代码:
List<City> citylist = 从数据获取所有的城市并封装成一个list。
request.setAttribute ("citylist ",citylist );
-----------------------------------------------
对应City类应该包含:
private String cityName;
private String cityID;
已经对应的get、set方法。
-----------------------------------------------
JS

function checkAll(){
    //全选
    var flag;
    var area = document.getElementsByName("Area");
    var len = area.length;

    var chall = document.getElementsByName("checkall")[0];
   
    if(chall.checked == true){
       
        for(i=0;i<len;i++){
            area[i].checked = "checked";
        }
    }

    if(chall.checked != true){
        for(i=0;i<len;i++){
            area[i].checked = "";
        }
    }
       
}


因为这个时候已经存在一个完整的html页面,而
<html:multibox   property="Area" ><bean:write name="city" property="cityID"/></html:multibox>
生成的代码为:
<input type="checkbox" name="Area" value="ln" checked="checked">辽宁
     
      <input type="checkbox" name="Area" value="ln/sy" checked="checked">沈阳
     
      <input type="checkbox" name="Area" value="ln/dl" checked="checked">大连
     
      ………………

所以可以使用     
var area = document.getElementsByName("Area");
来获取到checkbox的对象组,
然后采用循环进行check的设置。

注意的是 document.getElementsByName("Area"); 如果获取的是checkbox,此时返回的是一个object【】;
所以在取 全选 checkbox的checked的值的时候应该使用:
var chall = document.getElementsByName("checkall")[0];
才能获取到全选checkbox对象,然后再通过 chall 。checked 来判断是否 要进行 全选或者 全不选。

当然通过上面的获取对象方法则可以进行对checkbox的其他操作。


希望这些能够对大家有所帮助!

如对本文有疑问,请提交到交流论坛,广大热心网友会为你解答!! 点击进入论坛

发表评论 (1636人查看0条评论)
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
昵称:
最新评论
------分隔线----------------------------

快速入口

· 365软件
· 杰创官网
· 建站工具
· 网站大全

其它栏目

· 建站教程
· 365学习

业务咨询

· 技术支持
· 服务时间:9:00-18:00
365建站网二维码

Powered by 365建站网 RSS地图 HTML地图

copyright © 2013-2024 版权所有 鄂ICP备17013400号