In the future, I will write about this period of time to learn things, and share with you. This article is also a work of a note, I hope to meet the same problem friends, a little help.
In the development work, because to do use to CheckBoxList in the client with JS operation, no matter how JS debugging, is unable to obtain value, is very depressed, then Google, went to the CodeProject, is lucky. Let's put the code on the Web page:
Copy Code code as follows:
<asp:checkboxlist runat= "Server" id= "Chkdemo" repeatdirection= "horizontal" repeatlayout= "Flow" > <asp: ListItem text= "Test A" value= "a" ></asp:ListItem>
<asp:listitem text= "Test B" value= "B" ></asp:ListItem>
<asp:listitem text= "Test C" value= "C" ></asp:ListItem>
<asp:listitem text= "Test D" value= "D" ></asp:ListItem>
<asp:listitem text= "Test E" value= "E" ></asp:ListItem>
</asp:CheckBoxList>
When the browser renders this code, let's look at what kind of HTML script it is:
<table id= "Chkdemo" border= "0" >
<tr><td><input id= "chkdemo_0" type= "checkbox" Name= "chkdemo$0"/><label for= "chkDemo_0" > Test A </label></td>
<td><input id= "chkdemo_1" type= "checkbox" Name= "chkdemo$1"/><label for= "chkdemo_1" > Test B</label ></td>
<td><input id= "chkdemo_2" type= "checkbox" Name= "chkdemo$2"/><label for= "chkdemo_2" > Test C</label ></td>
<td><input id= "Chkdemo_3" type= "checkbox" Name= "chkdemo$3"/><label for= "Chkdemo_3" > Test D</label ></td>
<td><input id= "Chkdemo_4" type= "checkbox" Name= "chkdemo$4"/><label for= "Chkdemo_4" > Test E</label ></td> </tr></table>
This HTML script will be different for repeatlayout settings, but there is one thing in common: the generated checkbox has no value attribute.
So in the client with JS is no way to get the value of
In order to solve this problem, we need to expand the CheckBoxList: This is the source code I found on the CodeProject, the time is long, the link is not posted.
Copy Code code as follows:
[ToolBoxData ("<{0}:checkboxlistex runat=\" Server\ "></{0}:CheckBoxListEx>")]
public class Checkboxlistex:checkboxlist,irepeatinfouser
{
void Irepeatinfouser.renderitem (ListItemType itemType, int repeatindex, RepeatInfo RepeatInfo, HtmlTextWriter writer)
{
String ClientID = UniqueID + this. Clientidseparator + repeatindex.tostring (numberformatinfo.invariantinfo); Var
Writer. WriteBeginTag ("input");
Writer. WriteAttribute ("Type", "checkbox");
Writer. WriteAttribute ("name", UniqueID + this.) Idseparator + repeatindex.tostring (numberformatinfo.invariantinfo));
Writer. WriteAttribute ("id", ClientID);
Writer. WriteAttribute ("value", Items[repeatindex]. Value);
if (Items[repeatindex). Selected)
Writer. WriteAttribute ("Checked", "checked");
System.Web.UI.AttributeCollection attrs = Items[repeatindex]. Attributes;
foreach (String key in Attrs. Keys)
{
Writer. WriteAttribute (Key, Attrs[key]);
}
Writer. Write ("/>");
Writer. Write ("<label for= '" + ClientID + "' >");
Writer. Write (Items[repeatindex). Text);
Writer. Write ("</label>");
}
The above code is I modified, and the original version of some differences: ClientID generation and checked properties of the addition, I think this code does not need to explain the detailed.
Compiling it into a separate class will automatically appear on the toolbox, just like using the normal CheckBoxList, drag to the page.
At the client, our JS values are roughly as follows:
Copy Code code as follows:
<script>
function Getdemovalue ()
{var els = document.getElementById ("Chkdemo"); var vals= '; if (els!= null) {var chks = els.getelementsbytagname ("Inpu T "); for (var k = 0, Len = chks.length k < len; k++) {var chk = chks[k]; if (chk!= null && chk.type = ' checkbox ') && chk.checked) {vals+= ', ' + Chk.value;}}} }
if (vals.length>1)
Vals = vals.substring (1);
return vals;
}
</script>
End
