[转]关于VS05里checkboxlist用JS获取不到value值的解决方法
2009-12-19 22:15
986 查看
页面上有个服务器控件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,这样就搞定了:)
我上面是参考了博客园上 "人生苦短破茧"和"sammy知识库栖宇惊鸿的天下"写的关于checkboxlist用js取值的文章,综合了下,这样调用应该还是比较方便的,大家觉得有改进的地方回贴好了
参考文章如下: http://www.cnblogs.com/songsh96/archive/2007/08/27/871911.html http://www.cnblogs.com/Caceolod/articles/890809.html
关于这个方法我曾经在csdn论坛里也贴过,现在贴到园子里作为处女贴,见笑了呵呵,csdn上有位同志给了一个更好更简便的方法我也贴出来,如下
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Collections.Generic;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
List<string[]> metadata = new List<string[]>();
metadata.Add(new string[] { "项目前期", "505004"});
metadata.Add(new string[] { "项目进行中", "505001" });
metadata.Add(new string[] { "项目中期", "505003" });
metadata.Add(new string[] { "项目后期", "505005" });
metadata.Add(new string[] { "项目结束", "505002" });
metadata.Add(new string[] { "项目意外中止", "505006" });
ListItem lt;
for (int i = 0; i < metadata.Count; i++)
{
lt = new ListItem(metadata[i][0], metadata[i][1]);
lt.Attributes["text"] = metadata[i][0];
lt.Attributes["value1"] = metadata[i][1];
this.CheckBoxList1.Items.Add(lt);
}
}
}
HTML code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<script language="javascript" type="text/javascript">
function checkAll()
{
var ckelems = document.getElementById("CheckBoxList1").getElementsByTagName("input");
var spelems = document.getElementById("CheckBoxList1").getElementsByTagName("span");
for(var i=0;i<ckelems.length;i++)
{
if(ckelems[i].type=="checkbox")
{
if(ckelems[i].checked)
alert('文本是 '+spelems[i].text+' 值是 '+spelems[i].value1);
}
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:CheckBoxList ID="CheckBoxList1" runat="server" Height="261px" Width="301px">
</asp:CheckBoxList>
<input id="Button1" type="button" value="button" onclick="checkAll()"/></div>
</form>
</body>
</html>
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,这样就搞定了:)
我上面是参考了博客园上 "人生苦短破茧"和"sammy知识库栖宇惊鸿的天下"写的关于checkboxlist用js取值的文章,综合了下,这样调用应该还是比较方便的,大家觉得有改进的地方回贴好了
参考文章如下: http://www.cnblogs.com/songsh96/archive/2007/08/27/871911.html http://www.cnblogs.com/Caceolod/articles/890809.html
关于这个方法我曾经在csdn论坛里也贴过,现在贴到园子里作为处女贴,见笑了呵呵,csdn上有位同志给了一个更好更简便的方法我也贴出来,如下
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Collections.Generic;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
List<string[]> metadata = new List<string[]>();
metadata.Add(new string[] { "项目前期", "505004"});
metadata.Add(new string[] { "项目进行中", "505001" });
metadata.Add(new string[] { "项目中期", "505003" });
metadata.Add(new string[] { "项目后期", "505005" });
metadata.Add(new string[] { "项目结束", "505002" });
metadata.Add(new string[] { "项目意外中止", "505006" });
ListItem lt;
for (int i = 0; i < metadata.Count; i++)
{
lt = new ListItem(metadata[i][0], metadata[i][1]);
lt.Attributes["text"] = metadata[i][0];
lt.Attributes["value1"] = metadata[i][1];
this.CheckBoxList1.Items.Add(lt);
}
}
}
HTML code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<script language="javascript" type="text/javascript">
function checkAll()
{
var ckelems = document.getElementById("CheckBoxList1").getElementsByTagName("input");
var spelems = document.getElementById("CheckBoxList1").getElementsByTagName("span");
for(var i=0;i<ckelems.length;i++)
{
if(ckelems[i].type=="checkbox")
{
if(ckelems[i].checked)
alert('文本是 '+spelems[i].text+' 值是 '+spelems[i].value1);
}
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:CheckBoxList ID="CheckBoxList1" runat="server" Height="261px" Width="301px">
</asp:CheckBoxList>
<input id="Button1" type="button" value="button" onclick="checkAll()"/></div>
</form>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 关于VS05里checkboxlist用JS获取不到value值的解决方法[转]
- 关于VS05里checkboxlist用JS获取不到value值的解决方法
- [转载]关于VS05里checkboxlist用JS获取不到value值的解决方法
- 关于VS05里checkboxlist用JS获取不到value值的解决方法[转]
- 关于VS05里checkboxlist用JS获取不到value值的解决方法(处女随笔)
- checkboxlist用JS获取不到value值的解决方法
- VS05里checkboxlist用JS获取 value值
- 关于input标签带有enctype="multipart/form-data"而导致getParameter获取不到值的解决方法2
- ASP.NET获取不到JS设置cookies的解决方法
- jQuery获取checkboxlist的value值的方法
- ASP.NET WebForm 的CheckBoxList控件通过js获取Value值问题
- ASP.Net 关于前台JS给input赋值后，runat="server" 后台利用ID.Value还是获取不到的问题
- CheckBoxList 无法通过js获取选中value值 - 解决方案
- jQuery获取checkboxlist的value值的方法
- ASP.NET获取不到JS设置cookies的解决方法
- js获取不到动态添加的标签的值的解决方法
- ASP.NET获取不到JS设置cookies的解决方法
- checkboxList后台绑定取Value 取不到(解决办法)
- 使用Easyui的控件后，val()方法获取不到值的解决方法和比较日期大小的js方法
- checkboxList后台绑定取Value 取不到(解决办法)