checkbox and javascript

Discussion in 'ASP .Net' started by DotNetJunkies User, Nov 1, 2004.

  1. 1.
    i want to populate checkboxlist using javascript only at client side ....how can i do this..by populate word i mean that checkboxes should be checked or unchecked on some condition basis....

    2. after population there should be validation in checkboxlist.....
    that is if user clicks a button wihout checking any one of them(i.e. at least one shuld be checked) ... alerat message shouls come on the form.......

    these 2 steps should be done in javascript only(no server side programming, i know it can be done easily)

    ---
    Posted using Wimdows.net NntpNews Component -

    Post Made from http://www.DotNetJunkies.com/newsgroups Our newsgroup engine supports Post Alerts, Ratings, and Searching.
    DotNetJunkies User, Nov 1, 2004
    #1
    1. Advertising

  2. Hi,

    Creating checkboxlist is very simple. All u need to do is give the same id
    value for all the checkbox object.

    For eg:

    u have 3 checkbox and u wud like to create it as a checkboxlist,

    <input type=checkbox id="chkList">CheckBox 1
    <input type=checkbox id="chkList">CheckBox 2
    <input type=checkbox id="chkList">CheckBox 3


    The CheckBoxList is created. To access each checkbox object value, place the
    following javacsript in inside ur <head> tag.

    <script>
    function getValues()
    {
    var checkBoxList = document.getElementById("chkList");

    for(i=0;i<checkBoxList.length;i++)
    {
    if (checkBoxList .checked == true)
    {
    alert('CheckBox ' + i + ' is checked ')
    }
    }
    }
    </script>

    Call this "getValues();" function onclick of a button.

    <input type=button id="btn" onclick="getValues();">


    Hope this code helps u........

    Regards,
    Kamal T.

    "DotNetJunkies User" wrote:

    > 1.
    > i want to populate checkboxlist using javascript only at client side ....how can i do this..by populate word i mean that checkboxes should be checked or unchecked on some condition basis....
    >
    > 2. after population there should be validation in checkboxlist.....
    > that is if user clicks a button wihout checking any one of them(i.e. at least one shuld be checked) ... alerat message shouls come on the form.......
    >
    > these 2 steps should be done in javascript only(no server side programming, i know it can be done easily)
    >
    > ---
    > Posted using Wimdows.net NntpNews Component -
    >
    > Post Made from http://www.DotNetJunkies.com/newsgroups Our newsgroup engine supports Post Alerts, Ratings, and Searching.
    >
    =?Utf-8?B?S2FtYWwgVC4=?=, Nov 1, 2004
    #2
    1. Advertising

  3. DotNetJunkies User

    bruce barker Guest

    this code will not work. id's are supposed to be unique and getElementById
    only returns the first match. you can switch to usings the name attribute
    and getElementsByName it will work.

    <input type=checkbox name="chkList">CheckBox 1
    <input type=checkbox name="chkList">CheckBox 2
    <input type=checkbox name="chkList">CheckBox 3

    <script>
    function getValues()
    {
    var checkBoxList = document.getElementsByName("chkList");

    for(i=0;i<checkBoxList.length;i++)
    {
    if (checkBoxList .checked == true)
    {
    alert('CheckBox ' + i + ' is checked ')
    }
    }
    }
    </script>

    -- bruce (sqlwork.com)

    "Kamal T." <> wrote in message
    news:...
    > Hi,
    >
    > Creating checkboxlist is very simple. All u need to do is give the same

    id
    > value for all the checkbox object.
    >
    > For eg:
    >
    > u have 3 checkbox and u wud like to create it as a checkboxlist,
    >
    > <input type=checkbox id="chkList">CheckBox 1
    > <input type=checkbox id="chkList">CheckBox 2
    > <input type=checkbox id="chkList">CheckBox 3
    >
    >
    > The CheckBoxList is created. To access each checkbox object value, place

    the
    > following javacsript in inside ur <head> tag.
    >
    > <script>
    > function getValues()
    > {
    > var checkBoxList = document.getElementById("chkList");
    >
    > for(i=0;i<checkBoxList.length;i++)
    > {
    > if (checkBoxList .checked == true)
    > {
    > alert('CheckBox ' + i + ' is checked ')
    > }
    > }
    > }
    > </script>
    >
    > Call this "getValues();" function onclick of a button.
    >
    > <input type=button id="btn" onclick="getValues();">
    >
    >
    > Hope this code helps u........
    >
    > Regards,
    > Kamal T.
    >
    > "DotNetJunkies User" wrote:
    >
    > > 1.
    > > i want to populate checkboxlist using javascript only at client

    side ....how can i do this..by populate word i mean that checkboxes should
    be checked or unchecked on some condition basis....
    > >
    > > 2. after population there should be validation in checkboxlist.....
    > > that is if user clicks a button wihout checking any one of

    them(i.e. at least one shuld be checked) ... alerat message shouls come on
    the form.......
    > >
    > > these 2 steps should be done in javascript only(no server side

    programming, i know it can be done easily)
    > >
    > > ---
    > > Posted using Wimdows.net NntpNews Component -
    > >
    > > Post Made from http://www.DotNetJunkies.com/newsgroups Our newsgroup

    engine supports Post Alerts, Ratings, and Searching.
    > >
    bruce barker, Nov 1, 2004
    #3
  4. when i call the above fucntion on button's click event as follwoing
    ---------------------------------------------------------------------------------------------
    <asp:Button id="Button1" style="Z-INDEX: 101; LEFT: 104px; POSITION:
    absolute; TOP: 80px" runat="server"
    Text="Button" OnClick="getValues()">
    ----------------------------------------------------------------------------------------------
    then error comes as -->
    ----------------------------------------------------------------------------------------------
    Compiler Error Message: CS0117: 'ASP.WebForm1_aspx' does not contain a
    definition for 'getValues'

    ----------------------------------------------------------------------------------------------
    apart from this , i need that if user click on button without checking any
    one of them(i.e.at least one checkbox should be checked or selected by him
    before he submits page to server otherwise alert message should come that
    "plz check any one of them or select all of them" i.e. this problem is
    something related to validation


    "bruce barker" wrote:

    > this code will not work. id's are supposed to be unique and getElementById
    > only returns the first match. you can switch to usings the name attribute
    > and getElementsByName it will work.
    >
    > <input type=checkbox name="chkList">CheckBox 1
    > <input type=checkbox name="chkList">CheckBox 2
    > <input type=checkbox name="chkList">CheckBox 3
    >
    > <script>
    > function getValues()
    > {
    > var checkBoxList = document.getElementsByName("chkList");
    >
    > for(i=0;i<checkBoxList.length;i++)
    > {
    > if (checkBoxList .checked == true)
    > {
    > alert('CheckBox ' + i + ' is checked ')
    > }
    > }
    > }
    > </script>
    >
    > -- bruce (sqlwork.com)
    >
    > "Kamal T." <> wrote in message
    > news:...
    > > Hi,
    > >
    > > Creating checkboxlist is very simple. All u need to do is give the same

    > id
    > > value for all the checkbox object.
    > >
    > > For eg:
    > >
    > > u have 3 checkbox and u wud like to create it as a checkboxlist,
    > >
    > > <input type=checkbox id="chkList">CheckBox 1
    > > <input type=checkbox id="chkList">CheckBox 2
    > > <input type=checkbox id="chkList">CheckBox 3
    > >
    > >
    > > The CheckBoxList is created. To access each checkbox object value, place

    > the
    > > following javacsript in inside ur <head> tag.
    > >
    > > <script>
    > > function getValues()
    > > {
    > > var checkBoxList = document.getElementById("chkList");
    > >
    > > for(i=0;i<checkBoxList.length;i++)
    > > {
    > > if (checkBoxList .checked == true)
    > > {
    > > alert('CheckBox ' + i + ' is checked ')
    > > }
    > > }
    > > }
    > > </script>
    > >
    > > Call this "getValues();" function onclick of a button.
    > >
    > > <input type=button id="btn" onclick="getValues();">
    > >
    > >
    > > Hope this code helps u........
    > >
    > > Regards,
    > > Kamal T.
    > >
    > > "DotNetJunkies User" wrote:
    > >
    > > > 1.
    > > > i want to populate checkboxlist using javascript only at client

    > side ....how can i do this..by populate word i mean that checkboxes should
    > be checked or unchecked on some condition basis....
    > > >
    > > > 2. after population there should be validation in checkboxlist.....
    > > > that is if user clicks a button wihout checking any one of

    > them(i.e. at least one shuld be checked) ... alerat message shouls come on
    > the form.......
    > > >
    > > > these 2 steps should be done in javascript only(no server side

    > programming, i know it can be done easily)
    > > >
    > > > ---
    > > > Posted using Wimdows.net NntpNews Component -
    > > >
    > > > Post Made from http://www.DotNetJunkies.com/newsgroups Our newsgroup

    > engine supports Post Alerts, Ratings, and Searching.
    > > >

    >
    >
    >
    =?Utf-8?B?ZGVlcGFrIGt1bWFy?=, Nov 2, 2004
    #4
  5. ya Kamal, and Bruce ... my coe is working fine and done some modifcations in
    both of urs code according to my need.. my code is following
    ........................
    -------------------------------------------------------------------------------------------------
    <%@ Page language="c#" Codebehind="WebForm1.aspx.cs" AutoEventWireup="false"
    Inherits="thirdpro.WebForm1" %>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
    <HTML>
    <HEAD>
    <title>WebForm1</title>
    <meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
    <meta content="C#" name="CODE_LANGUAGE">
    <meta content="JavaScript" name="vs_defaultClientScript">
    <meta content="http://schemas.microsoft.com/intellisense/ie5"
    name="vs_targetSchema">
    <script language="javascript">
    function getValues()
    {
    var checkBoxList1 = document.getElementById("chkList1");
    var checkBoxList2 = document.getElementById("chkList2");
    var checkBoxList3 = document.getElementById("chkList3");

    if ((checkBoxList1.checked != true) && (checkBoxList2.checked != true) &&
    (checkBoxList3.checked != true))
    {
    alert('Plz Select At Least One Value....');
    }
    else
    {
    alert('Crawling Processing....');
    }
    }

    </script>
    </HEAD>
    <body MS_POSITIONING="GridLayout">
    <form id="Form1" method="post" runat="server">
    <input id="chkList1" type="checkbox" >CheckBox1
    <input id="chkList2" type="checkbox" >CheckBox1
    <input id="chkList3" type="checkbox" >CheckBox1
    <input id="btn" value="Set Crawl" style="Z-INDEX: 101; LEFT: 40px;
    WIDTH: 80px; POSITION: absolute; TOP: 192px; HEIGHT: 24px"
    onclick="getValues()" type="button">
    </form>
    </body>
    </HTML
    -------------------------------------------------------------------------------------------------
    thanks a lot for helping me ......bruce how can i become MVP (is there any
    paper of microsoft for this or any other way...tell me and guide me
    plz..kamal thanks ..u seems to be indian ..i m 26/m/delhi/ working in C# in a
    firm whoch is not a S/W development .. im working in a team of only 3 people
    so i will need urs help time to time .thanks a lot......once again..see u
    soon with new probelm bye )

    "deepak kumar" wrote:

    > when i call the above fucntion on button's click event as follwoing
    > ---------------------------------------------------------------------------------------------
    > <asp:Button id="Button1" style="Z-INDEX: 101; LEFT: 104px; POSITION:
    > absolute; TOP: 80px" runat="server"
    > Text="Button" OnClick="getValues()">
    > ----------------------------------------------------------------------------------------------
    > then error comes as -->
    > ----------------------------------------------------------------------------------------------
    > Compiler Error Message: CS0117: 'ASP.WebForm1_aspx' does not contain a
    > definition for 'getValues'
    >
    > ----------------------------------------------------------------------------------------------
    > apart from this , i need that if user click on button without checking any
    > one of them(i.e.at least one checkbox should be checked or selected by him
    > before he submits page to server otherwise alert message should come that
    > "plz check any one of them or select all of them" i.e. this problem is
    > something related to validation
    >
    >
    > "bruce barker" wrote:
    >
    > > this code will not work. id's are supposed to be unique and getElementById
    > > only returns the first match. you can switch to usings the name attribute
    > > and getElementsByName it will work.
    > >
    > > <input type=checkbox name="chkList">CheckBox 1
    > > <input type=checkbox name="chkList">CheckBox 2
    > > <input type=checkbox name="chkList">CheckBox 3
    > >
    > > <script>
    > > function getValues()
    > > {
    > > var checkBoxList = document.getElementsByName("chkList");
    > >
    > > for(i=0;i<checkBoxList.length;i++)
    > > {
    > > if (checkBoxList .checked == true)
    > > {
    > > alert('CheckBox ' + i + ' is checked ')
    > > }
    > > }
    > > }
    > > </script>
    > >
    > > -- bruce (sqlwork.com)
    > >
    > > "Kamal T." <> wrote in message
    > > news:...
    > > > Hi,
    > > >
    > > > Creating checkboxlist is very simple. All u need to do is give the same

    > > id
    > > > value for all the checkbox object.
    > > >
    > > > For eg:
    > > >
    > > > u have 3 checkbox and u wud like to create it as a checkboxlist,
    > > >
    > > > <input type=checkbox id="chkList">CheckBox 1
    > > > <input type=checkbox id="chkList">CheckBox 2
    > > > <input type=checkbox id="chkList">CheckBox 3
    > > >
    > > >
    > > > The CheckBoxList is created. To access each checkbox object value, place

    > > the
    > > > following javacsript in inside ur <head> tag.
    > > >
    > > > <script>
    > > > function getValues()
    > > > {
    > > > var checkBoxList = document.getElementById("chkList");
    > > >
    > > > for(i=0;i<checkBoxList.length;i++)
    > > > {
    > > > if (checkBoxList .checked == true)
    > > > {
    > > > alert('CheckBox ' + i + ' is checked ')
    > > > }
    > > > }
    > > > }
    > > > </script>
    > > >
    > > > Call this "getValues();" function onclick of a button.
    > > >
    > > > <input type=button id="btn" onclick="getValues();">
    > > >
    > > >
    > > > Hope this code helps u........
    > > >
    > > > Regards,
    > > > Kamal T.
    > > >
    > > > "DotNetJunkies User" wrote:
    > > >
    > > > > 1.
    > > > > i want to populate checkboxlist using javascript only at client

    > > side ....how can i do this..by populate word i mean that checkboxes should
    > > be checked or unchecked on some condition basis....
    > > > >
    > > > > 2. after population there should be validation in checkboxlist.....
    > > > > that is if user clicks a button wihout checking any one of

    > > them(i.e. at least one shuld be checked) ... alerat message shouls come on
    > > the form.......
    > > > >
    > > > > these 2 steps should be done in javascript only(no server side

    > > programming, i know it can be done easily)
    > > > >
    > > > > ---
    > > > > Posted using Wimdows.net NntpNews Component -
    > > > >
    > > > > Post Made from http://www.DotNetJunkies.com/newsgroups Our newsgroup

    > > engine supports Post Alerts, Ratings, and Searching.
    > > > >

    > >
    > >
    > >
    =?Utf-8?B?ZGVlcGFrIGt1bWFy?=, Nov 2, 2004
    #5
  6. bruce is right...... it shld. be name attribute instead of id

    "Kamal T." wrote:

    > Hi,
    >
    > Creating checkboxlist is very simple. All u need to do is give the same id
    > value for all the checkbox object.
    >
    > For eg:
    >
    > u have 3 checkbox and u wud like to create it as a checkboxlist,
    >
    > <input type=checkbox id="chkList">CheckBox 1
    > <input type=checkbox id="chkList">CheckBox 2
    > <input type=checkbox id="chkList">CheckBox 3
    >
    >
    > The CheckBoxList is created. To access each checkbox object value, place the
    > following javacsript in inside ur <head> tag.
    >
    > <script>
    > function getValues()
    > {
    > var checkBoxList = document.getElementById("chkList");
    >
    > for(i=0;i<checkBoxList.length;i++)
    > {
    > if (checkBoxList .checked == true)
    > {
    > alert('CheckBox ' + i + ' is checked ')
    > }
    > }
    > }
    > </script>
    >
    > Call this "getValues();" function onclick of a button.
    >
    > <input type=button id="btn" onclick="getValues();">
    >
    >
    > Hope this code helps u........
    >
    > Regards,
    > Kamal T.
    >
    > "DotNetJunkies User" wrote:
    >
    > > 1.
    > > i want to populate checkboxlist using javascript only at client side ....how can i do this..by populate word i mean that checkboxes should be checked or unchecked on some condition basis....
    > >
    > > 2. after population there should be validation in checkboxlist.....
    > > that is if user clicks a button wihout checking any one of them(i.e. at least one shuld be checked) ... alerat message shouls come on the form.......
    > >
    > > these 2 steps should be done in javascript only(no server side programming, i know it can be done easily)
    > >
    > > ---
    > > Posted using Wimdows.net NntpNews Component -
    > >
    > > Post Made from http://www.DotNetJunkies.com/newsgroups Our newsgroup engine supports Post Alerts, Ratings, and Searching.
    > >
    =?Utf-8?B?S2FtYWwgVC4=?=, Nov 2, 2004
    #6
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. tshad
    Replies:
    0
    Views:
    510
    tshad
    Apr 15, 2005
  2. Vikram

    disable checkbox list checkbox

    Vikram, Jan 25, 2006, in forum: ASP .Net
    Replies:
    1
    Views:
    1,385
    ThunderMusic
    Jan 25, 2006
  3. =?Utf-8?B?RG90TmV0RGV2?=

    DataGrid and embeded Checkbox..How to find if checkbox clicked

    =?Utf-8?B?RG90TmV0RGV2?=, Oct 6, 2006, in forum: ASP .Net
    Replies:
    1
    Views:
    808
    David Wier
    Oct 6, 2006
  4. Jason Huang
    Replies:
    0
    Views:
    540
    Jason Huang
    Jun 29, 2007
  5. Michael Champagne
    Replies:
    4
    Views:
    333
    Matt Kruse
    Apr 20, 2004
Loading...

Share This Page