CheckBoxList 和 DropDownList 的二级联动

转载 2007年09月24日 12:56:00
<script language="javascript" type="text/javascript">
    
<!--
        
// 添加 CheckBoxList 事件
        function addAffair()
        
{
            
var checkList = document.getElementById("cblTeamPerson");
            
var childrens = checkList.getElementsByTagName("input") ;
            
var count = childrens.length ;
            
if (count == 0 )
                
return ;
                
            
var checkBox ;
            
var checkBoxid ;
            
for (var i = 0 ; i < count ; i ++ )
            
{
                checkBoxid 
= "cblTeamPerson_" + i ;
                checkBox 
= document.getElementById(checkBoxid);                           
                checkBox.onclick 
= function(ev)
                
{
                    checkedAffair((ev 
|| window.event).srcElement  || ev.currentTarget);
                }

            }
            
        }

        
        
// 添加 CheckBox 的 onclick 事件
        function checkedAffair(checkBoxID)
        
{
            
var checkBox = document.getElementById(checkBoxID.id);
            
var dropDownList = document.getElementById("ddlTeamLeader");
            
if (checkBox.checked == true)
            
{
                
var newOption = document.createElement("OPTION") ;
                newOption.text 
= getText(checkBox.id) ;
                newOption.value 
= getValue(checkBox.id) ;
                dropDownList.options.add(newOption);
            }

            
else if (checkBox.checked == false)
            
{
                
var strValue = getValue(checkBox.id) ;
                
var count = dropDownList.options.length ;
                
var children ;
                
                
for (var i = 0 ; i < count ; i ++)
                
{
                    children 
= dropDownList.options[i].value ;
                    
if (children == strValue)
                    
{
                        dropDownList.options.remove(i) ;
                     }

                }

            }

        }

        
        
// Get the event.onclick Text
        function getText(checkBoxID)
        
{
            
var checkBoxList = document.getElementById("cblTeamPerson");
            
var checkbox = checkBoxList.getElementsByTagName("input");
            
var index = getValue(checkBoxID);
            
var intIndex = parseInt(index);
            
            alert(checkbox[index].nextSibling.innerHTML);            
            
            
var value = checkbox[index].nextSibling.innerHTML ;
            
return value ;
        }

        
        
// Get the event.onclick Value
        function getValue(checkBoxID)
        

            
var checkBox = document.getElementById(checkBoxID);
            
var factLength = checkBox.id.length;                   
            
if (factLength == 15)
            
{
                
return checkBox.id.substring(14,15) ;
            }

            
else
            
{
                
return checkBox.id.substring(14,16) ;
            }

        }

    
//-->
    </script>

 

遇到的2个比较严重的问题

1、在addAffair()时,页面生成后给客户端生成的单一的checkbox挂onclick事件,如果直接写成

checkBox.onclick = checkedAffair();是不响应的,这是在调用函数,应该

checkBox.onclick = function(ev) { 函数 }

 

2、getText(),取不到checkbox的Text,Value貌似确实取不到,改用获取checkbox的ClientID的尾数来记录value的办法,但是getElementById,取到的只是“on”,后来又想根据getElementsByTagName("input")得到checked的index,但是返回的值是undefind,后来又想通过CheckBoxList生成的<table>,用DOM模型来取,依然找不到

解决办法    var value = checkbox[index].nextSibling.innerHTML;


 

相关文章推荐

YII widget之dropDownList的二级联动与分组

第一建表: CREATE TABLE IF NOT EXISTS `sw_category` ( `id` int(11) NOT NULL auto_increment, `parent_i...
  • slyjit
  • slyjit
  • 2013年12月09日 16:00
  • 1780

DropDownList无刷新二级联动(.ashx)

因工作需要,需做一下拉框无刷新二级联动功能。上网搜索到很多种实现方式,最后选中一大神写的,谢谢这位大神!大神文章地址(http://blog.csdn.net/wangjun8868/article/...

访问Access数据库实现DropDownList二级异步联动(ASP.NET WebForm开发方式)

访问Access数据库实现DropDownList二级异步联动(ASP.NET WebForm开发方式)
  • anbuhay
  • anbuhay
  • 2015年03月21日 20:08
  • 409

MVC dropdownlist二级联动

在做输入的时候,有时候需要用到多个dropdownlist联动,所以在网上搜集了相关资料后,自己也拿具体的MVC案例整理了一下,希望可以帮到也在找这个问题的同学们: model: public...

dropdownlist做的二级联动

  • 2010年08月04日 23:02
  • 80KB
  • 下载

c#枚举类型在web控件CheckBoxList,RadioButtonList,DropDownList中的应用

在做web项目的时候经常使用CheckBoxList,RadioButtonList,DropDownList控件,对于这些控件的数据源如果需要客户动态维护的一般存于数据库中,但是大量的这些控件的数据...

NET:Checkboxlist,Dropdownlist 添加ToolTip说明

ToolTip属性: ToolTip 类 (System.Windows.Controls)‎  表示创建弹出项的控件,该弹出项可显示界面中元素的相关信息。命名空间: System.Win...
  • istend
  • istend
  • 2014年07月14日 17:30
  • 1047

dropdownlist三级联动数据库

  • 2015年12月08日 16:14
  • 19KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:CheckBoxList 和 DropDownList 的二级联动
举报原因:
原因补充:

(最多只允许输入30个字)