JavaScript - how to get Check Box Values using JAvaScript

Asked By Anto Bilson on 18-Jul-11 09:51 AM


 hi friends...
 i've multiple checkboxes .. when i check the checkboxes i want display the values and text of checkbox...
pls give me solution
Riley K replied to Anto Bilson on 18-Jul-11 09:57 AM

Use  this code

$(":checkbox").each(function() {
 
if (this.checked) {
    alert
(this.value);
 
}
});
Jitendra Faye replied to Anto Bilson on 18-Jul-11 09:58 AM
Use this code-

<script>
function funGetValue(value)
 {
    var val= value;
    alert(val);
    document.getElementById("txt").value=val;
 }
</script>


   <input type="checkbox" value="ckh1" onclick="funGetValue(this.value)">
   <input type="checkbox" value="ck2" onclick="funGetValue(this.value)>
   <input type="checkbox" value="ck3" onclick="funGetValue(this.value)>
 <input type="Text" id="txt" >

Try this code and let me know.
Anto Bilson replied to Anto Bilson on 18-Jul-11 10:14 AM


  var chklist=gvOperator.getElementsByTagName('input');   
    for(var i=0;i<chklist.length;i++)
    {      
      if(chklist[i].checked==true)
      {      
      var ChkValues=chklist[i].parentNode.parentNode; // First ParentNode to find Table then second ParentNode to find TD Tag it's goes on     
      alert(ChkValues.cells[1].innerHTML);  // get check box value
     alert(ChkValues.cells[2].innerHTML);  // get checkbox text
      }
    }

 because i've 2 fields in my gridview (Id and Text Only)...
dipa ahuja replied to Anto Bilson on 18-Jul-11 11:25 AM
 <script type="text/javascript">
    var atLeast = 1
    function Validate() {
      var CHK = document.getElementById("<%=CheckBoxList1.ClientID%>");
      var checkbox = CHK.getElementsByTagName("input");
      var label = CHK.getElementsByTagName("label");
      var counter = 0;
      //validation to check atleast one item is selected
      for (var i = 0; i < checkbox.length; i++) {
        var checkitem = checkbox[i];
        if (checkitem.checked) {
        //Give the selected Checkbox value
          alert("Selected item is" + label[i].innerHTML);
          counter++;
        }
      }
      if (atLeast > counter) {
        alert("Please select atleast " + atLeast + " item(s)");
        return false;
      }
      return true;
    }
    </script>
 <asp:Button ID="Button3" runat="server" Text="Button" OnClientClick="return Validate();" />
  <asp:CheckBoxList AutoPostBack="true" ID="CheckBoxList1" runat="server">
    <asp:ListItem>ASP./net</asp:ListItem>
    <asp:ListItem>C#</asp:ListItem>
  </asp:CheckBoxList>
Radhika roy replied to Anto Bilson on 18-Jul-11 01:21 PM
Use this code-

<script>
function funcheck()
 {
   var chk= document.getElementById("chk1");
   if(chk.checked)
    {
   document.getElementById("txt").value=ckh1.value;
   }
 }
</script>



   <input type="checkbox" value="ckh1" onclick="funcheck()">
   <input type="Text" id="txt" >

Try this code and let me know.

Hope this will help you.
Reena Jain replied to Anto Bilson on 18-Jul-11 02:21 PM
Hi,

You can use GetElementsByTagName of javascript DOM method to get the controls from tag name, here input is the tag name so it goes like following

<script>
function GetChecked()
{
  var container =  document.getElementById('<% rptCat.ClientID %>');
  var totalInputs = container.getElementsByTagName('input');
  for(var i = 0;i< totalInputs.Length;i++)
  {
  if(totalInputs[i].type.toLowerCase()=='checkbox' && totalInputs[i].checked)
  {
    id += totalInputs[i].id;
  }   
  }
}
</script>

this way you can get them
Devil Scorpio replied to Anto Bilson on 18-Jul-11 04:31 PM
Hi,

The example is showing how to get value from separate name checkbox in JavaScript.

<html>
<head>
<title>JavaScript select checkbox</title>
<script>
function selectCheckBox()
{
   alert(document.frm.id1.value)
   alert(document.frm.id2.value)
   alert(document.frm.id3.value)
}
</script>
</head>

<body>
<form name="frm">
<input type="checkbox" name="id1" value="1">
<input type="checkbox" name="id2" value="2">
<input type="checkbox" name="id3" value="3">

<input type="button" name="goto" onClick="selectCheckBox()" value="Check">
</form>
</body>
</html>