关于asp.net里checkboxlist用JS获取不到value值的解决方法

页面上有个服务器控件checkboxlist,想要获取选中的value值,
          var chkObject = document.getElementById('<%=chkProjStatus.ClientID%>');
             var chkInput =chkObject.getElementsByTagName("INPUT");
             for(var i=0;i<chkInput.length;i++)
             {
                 if(chkInput[i].checked)
                {
                    alert(chkInput[i].value);
                }
             }
发现按上面的方法是取不到的, 由于checkboxlist在前台html页面表现中没有value属性,导致js无法获取选种的value值
须用程序来添加value和text属性,还是给个实际的dome吧 ,新建一个xx.aspx页面,cs文件代码如下

     protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            BindChkList();
        }
    }
    /// <summary>
    /// 绑定复选框
    /// </summary>
    private void BindChkList()
    {
        chkProjStatus.Items.Add(new ListItem("项目前期", "505004"));
        chkProjStatus.Items.Add(new ListItem("项目进行中", "505001"));
        chkProjStatus.Items.Add(new ListItem("项目中期", "505003"));
        chkProjStatus.Items.Add(new ListItem("项目后期", "505005"));
        chkProjStatus.Items.Add(new ListItem("项目结束", "505002"));
        chkProjStatus.Items.Add(new ListItem("项目意外中止", "505006"));//这里您可以绑定数据库里的数据

        string checkListValue = "";
        string checkListText = "";
        for (int i = 0; i < chkProjStatus.Items.Count; i++)
        {
            checkListValue += chkProjStatus.Items[i].Value + ",";
            checkListText +=  chkProjStatus.Items[i].Text + ",";
        }
        checkListText = checkListText.TrimEnd(',');
        checkListValue = checkListValue.TrimEnd(',');

        //由于checkboxlist在前台html页面表现中没有value属性,导致js无法获取选种的value值
        //这里用程序来添加value和text属性
        chkProjStatus.Attributes["ListValue"] = checkListValue;
        chkProjStatus.Attributes["ListText"] = checkListText;
    }

   aspx页面的js脚本这样来:
    function CheckValue()
         {
            //在JS端调用CheckBoxList
             var chkObject = document.getElementById('<%=chkProjStatus.ClientID%>');
             var chkInput =chkObject.getElementsByTagName("INPUT");
             var arrListValue = chkObject.ListValue.split(',');
             var count = arrListValue.length;
             var strCheckChecked = "";  
             var arrCheckChecked;
             var chkValue = "";
                
//每次点击CheckBoxList的一个Item,都循环把所有Item的选中状态按0、1标志,存入一个变量,最后再根据这个标志来决定checkboxlist中要取的值
                
                for (var i=0; i< chkInput.length; i++) 
                { 
                    if(chkInput[i].checked)
                    {
                        strCheckChecked = strCheckChecked + "1" + ",";
                    }
                    else
                    {
                        strCheckChecked = strCheckChecked + "0" + ",";
                    }
               } 
                arrCheckChecked =  RTrim(strCheckChecked).split(',');
                 for(var j = 0; j < count; j++)
                 {
                     if(arrCheckChecked[j] == "1")
                     {
                         chkValue += arrListValue[j] +",";
                     }
                 } 
                 chkValue =  RTrim(chkValue); 
                 alert(chkValue); 
            
         }
         
        //如果有则移除末尾的逗号
        function RTrim(str) 
        { 
            if(str.charAt(str.length-1)==",")
               return str.substring(0,str.length-1); 
            else
               return str; 
        }
OK,这样就搞定了:)  但是似乎不支持火狐浏览器。

 

 

可以用第二个办法:
直接输出<input id=\"Texx_BiaoQian_" + i + "\" onclick=\"BiaoQian('" + i + "','" + RecordList.Rows[i]["B_SN"].ToString() + "','1')\" type=\"checkbox\" />
BiaoQianSN.Append("<input type=\"hidden\" id=\"Texx_BiaoQian\" />");
然后调用js去做判断
 function BiaoQian(ID,B_SN)//第几个标签,选中的值得
    {
             if(document.getElementById("Texx_BiaoQian_" + ID).checked)//如果选中
             {
                 document.getElementById("Texx_BiaoQian").value += B_SN + ",";
             }
             else
             {
                 var reg=new RegExp(B_SN+",",""); //创建正则RegExp对象   
                 var stringObj=document.getElementById("Texx_BiaoQian").value;   
                 var newstr=stringObj.replace(reg,"");   
                 document.getElementById("Texx_BiaoQian").value = newstr;
             }
    }    

最后获得document.getElementById("Texx_BiaoQian").value 的值就是想要的值了。

 

 


//判断是否选择了最少一项,可用
var xz = 0;
$('#Texx_yd_TianJingZiXiang input[type="checkbox"]:checked').each(function () {
xz++;
});
if (xz == 0)
{
alert('请选择拟报名田径类子项');
return;
}
//判断是否选择了最少一项,可用

posted @ 2015-10-08 15:19  z542601362  阅读(575)  评论(0)    收藏  举报