Geting Checkboxlist value in javascript

  • Thread starter Thread starter Satheesh Babu B
  • Start date Start date
S

Satheesh Babu B

hai..
am having a checkboxlist..now how do i get the value of the checkbox
that is checked in checkboxlist using javascript?



Thanks in advance....


Regards,
Satheesh
 
Thanks for ur reply patrich but it did'nt solve my problem..pls help
me..


how to retrive the value of checkbox that is checked in checkboxlist
using javascript..


Regards,
Satheesh
 
i have used the coding..

document.getElementById('CheckBoxList1_0').value;


but it is giving the result as on. how to accomplish this one???


regards,
Satheesh
 
well, you can do this in two ways:

1. (Not a good one) ids for checkboxes in checkboxlists are created like
this:
"nameOfAcheckboxlist_nextNumber"

so you can loop

for (i = 0; i < number; i++)
{
if (document.getElementByID("checkboxlistName_" + i ).checked)
{
//do something
}
}

or

2. (Better one) On server side create a javascript array that contains
checkbox'es .ClientID
And on a client side loop through this array.

for (i = 0; i < idsArray.length; i++)
{
if (document.getElementByID(idsArray).checked)
{
//do something
}
}

hope this helps.
 
What i can advice you is try viewing the source code of the page and you
will see the
Id created for the checkboxlist which i guess it would be similar to what
you posted..
Is you Checkboxlist in any other control or are you databinding your
Checkboxlist
Post more info
PAtrick
 
The code generated is...

<table id="CheckBoxList1" border="0" style="Z-INDEX: 104; LEFT: 384px;
POSITION: absolute; TOP: 112px">
<tr>
<td><input id="CheckBoxList1_0" type="checkbox"
name="CheckBoxList1:0" /><label for="CheckBoxList1_0">one</label></td>
</tr><tr>
<td><input id="CheckBoxList1_1" type="checkbox"
name="CheckBoxList1:1" /><label for="CheckBoxList1_1">2</label></td>
</tr><tr>
<td><input id="CheckBoxList1_2" type="checkbox"
name="CheckBoxList1:2" /><label for="CheckBoxList1_2">3</label></td>
</tr><tr>
<td><input id="CheckBoxList1_3" type="checkbox"
name="CheckBoxList1:3" /><label for="CheckBoxList1_3">4</label></td>
</tr>
</table>

Regards,
Satheesh
 
i have used the coding..

document.getElementById('CheckBoxList1_0').value;

but it is giving the result as on. how to accomplish this one???
Click to expand...

I'm not sure what your problem is. When a checkbox is checked, it has a
value of 'on' - when it's not, it doesn't...

<script>

if(document.getElementById('CheckBoxList1_0').value == 'on')
{
alert('Checked');
}
else
{
alert('Not checked');
}

</script>
 
Co slychac Sebastian?

Sebastian Wojciechowski said:
well, you can do this in two ways:

1. (Not a good one) ids for checkboxes in checkboxlists are created like
this:
"nameOfAcheckboxlist_nextNumber"

so you can loop

for (i = 0; i < number; i++)
{
if (document.getElementByID("checkboxlistName_" + i ).checked)
{
//do something
}
}

or

2. (Better one) On server side create a javascript array that contains
checkbox'es .ClientID
And on a client side loop through this array.

for (i = 0; i < idsArray.length; i++)
{
if (document.getElementByID(idsArray).checked)
{
//do something
}
}

hope this helps.

Satheesh Babu B said:
hai..
am having a checkboxlist..now how do i get the value of the checkbox
that is checked in checkboxlist using javascript?



Thanks in advance....


Regards,
Satheesh
Click to expand...
Click to expand...
 
i am Simply giving values 1,2,3,4 as text and value for the checkbox
item in the checkboxlist.if i check the checkbox with text "1".How
should i get that value using javascript..

I think its clear now..
 
there are no values set for the checkboxes, so the value is alway empty,
but your are interested in if the the user checked the checkbox. in
javascript its just:

if (document.getElementById("CheckBoxList1_0").checked)
{
// do something with checked box
}


note: the value of a checkbox is the value set in tag, and has nothing to do
with whether checked or not. the value is what is posted back in the
name/value pair if the box is checked.

-- bruce (sqlwork.com)
 
Did you ever find a solution to this? I am having a similar issue
without much luck of a solution. Have spent a few hours to no avail.

This is what I have found: When creating a CheckBoxList, at runtime it
is rendered as an HTML table. I, like you, need to get the value of
items checked, but am only receiving "on" for the value of all items,
checked or not. Looking at my source code of the rendered page, there
are no "Value" tags for the check boxes. I can get the "Label" value,
but that is a descriptive item; I need the value that I set in the
"DataValueField" at design time.

My CheckBoxList is named "cblist_facilities". I have a "Test" button
which calls the following code:

###

function Button1_onclick() {
var cblist = "cblist_facilities";
var chkList1= document.getElementById(cblist);

var arrayOfCheckBoxes= chkList1.getElementsByTagName("input");
var arrayOfCheckBoxLabels= chkList1.getElementsByTagName("label");
var listcount = arrayOfCheckBoxes.length;
var displ="";

alert(listcount + " items in list.");

for(var i=0;i<arrayOfCheckBoxes.length;i++) {
displ= "" + (i+1) + ": " + arrayOfCheckBoxes.checked + " - "
+ arrayOfCheckBoxLabels.innerText;
alert(displ);
alert(arrayOfCheckBoxes.value);
}

}

###

When run, the first alert correctly displays the number of checkboxes.
The second alert ("displ") correctly displays whether the checkbox is
checked or not and the correct descriptive label. However, the third
alert (...value) displays "on" for all checkboxes, checked or not.

Thoughts?
 
this is what I'm using in a RabioButoonList (and it's Online and work
perfectly)

RBL code
-----------------------
<asp:RadioButtonList ID="rblLoanType" runat="server"
CssClass="wizardFormRadio"

Font-Bold="False" RepeatLayout="Flow" Width="210px" >

<asp:ListItem Value="Normal Konto">Normal Konto</asp:ListItem>

<asp:ListItem Value="Udskudt forste betaling">Udskudt første
betaling</asp:ListItem>

<asp:ListItem Value="Kampagnekonto">Kampagnekonto</asp:ListItem>

</asp:RadioButtonList>

-----------------------

JS code
-----------------------
function getAmount(nform) {

var a = document.getElementById('<%= rblLoanType.ClientID %>_0').checked;

var b = document.getElementById('<%= rblLoanType.ClientID %>_1').checked;

var c = document.getElementById('<%= rblLoanType.ClientID %>_2').checked;

if ( nform == 0 || a == true) {

...

-----------------------

hop it helps
--

Bruno Alexandre
København, Danmark

"a portuguese in Denmark"
 
i am Simply giving values 1,2,3,4 as text and value for the >checkbox
item in the checkboxlist
[cut]

Hello, all,
I also had to face such a thing and I solved it in a quite simple way.
When loading your page, after doing Page.DataBind() (or
CheckBoxList1.DataBind(), it's the same), you should loop on your
checkbox items, and add an "onclick" attribute. This attribute should
call a function that contains, as an argument, the value (or text,
depending on what you have to do with it; for me it's necessary a text)
of your list item. Here it is my code:

On aspx page:
<script runat="server">

protected void Page_Load(object sender, EventArgs e)
{
this.DataBind();
foreach (ListItem var in CheckBoxList1.Items)
{
// aggiungo anche l'onclick
var.Attributes.Add("onclick", "javascript:ShowValue('" +
var.Text + "');");
}
}
</script>

Javascript code:
function ShowValue(ctl)
{
alert(ctl);
}

Don't forget of treating var.Text (or var.Value) as a string.
 
Back
Top