Solved

.Net Checkboxlist select all javascript

Posted on 2008-10-13
5
703 Views
Last Modified: 2012-06-27
Hi experts,

How do I achieve the following.

I have a checkbox list in .net
aspx

 <asp:CheckBoxList ID="lstDays" runat="server" Height="185px" onclick="check(this)">
 <asp:ListItem Value="0" Selected="True" runat="server">All</asp:ListItem>
            <asp:ListItem Value="1">Monday</asp:ListItem>
            <asp:ListItem Value="2">Tuesday</asp:ListItem>
            <asp:ListItem Value="3">Wednesday</asp:ListItem>
            <asp:ListItem Value="4">Thursday</asp:ListItem>
            <asp:ListItem Value="5">Friday</asp:ListItem>
            <asp:ListItem Value="6">Saturday</asp:ListItem>
            <asp:ListItem Value="7">Sunday</asp:ListItem>
        </asp:CheckBoxList>

I want to be able to select all that will check all the boxes, or if i select one or two days the all box gets unchecked.

What is the right way about coding the javascript.

I tried <script>function check(sel){alert(sel.selectedIndex);
}</script> to get started but I get undefined

Thanks experts
0
Comment
Question by:nikdonovanau
  • 2
  • 2
5 Comments
 
LVL 16

Accepted Solution

by:
Gyanendra Singh earned 500 total points
Comment Utility
<script language="javascript" type="text/javascript">function Select(Select){
for (var n=0; n < document.forms[0].length; n++) if (document.forms[0].elements[n].type==checkbox)
document.forms[0].elements[n].checked=Select; return false; }</script>
Select <a href="#" onclick="javascript:Select(true)">All</a> | <a href="#" onclick="javascript:Select(false)">None</a>
0
 
LVL 1

Author Closing Comment

by:nikdonovanau
Comment Utility
Love your work

Thanks for the fast response. Worked perfectly
0
 
LVL 5

Expert Comment

by:varungd
Comment Utility
Try this
<script language="javascript">

       function check() 

       {

          debugger

         

          if(event.srcElement.id == "lstDays_0")

            {

	            if(event.srcElement.checked == true)

	            {

	            for(var i=0;i<lstDays.rows.length+1;i++)

	              {

	                 if( document.forms[0].elements[i].type =="checkbox" )

                        {

	                        if(document.forms[0].elements[i].checked== false)

	                        {

		                       document.forms[0].elements[i].checked =true;

	                        }

                        }

	              }

			

	            }

	            

	            else

	            {

	              for(var i=0;i<lstDays.rows.length+1;i++)

	              {

	                 if( document.forms[0].elements[i].type =="checkbox" )

                        {

	                        if(document.forms[0].elements[i].checked== true)

	                        {

		                       document.forms[0].elements[i].checked =false;

	                        }

                        }

	              }

	            

	            }

            }

     

       }
 

    </script>
 
 
 

 <asp:CheckBoxList ID="lstDays" runat="server" Height="185px" onclick="check()">

       <asp:ListItem Value="0" Selected="True" >All</asp:ListItem>

            <asp:ListItem Value="1">Monday</asp:ListItem>

            <asp:ListItem Value="2">Tuesday</asp:ListItem>

            <asp:ListItem Value="3">Wednesday</asp:ListItem>

            <asp:ListItem Value="4">Thursday</asp:ListItem>

            <asp:ListItem Value="5">Friday</asp:ListItem>

            <asp:ListItem Value="6">Saturday</asp:ListItem>

            <asp:ListItem Value="7">Sunday</asp:ListItem>

        </asp:CheckBoxList>

Open in new window

0
 
LVL 16

Expert Comment

by:Gyanendra Singh
Comment Utility
your welcome
0
 
LVL 5

Expert Comment

by:varungd
Comment Utility
Try this . Previous one is missing some lines......
 
 

<script language="javascript">

       function check() 

       {

          

         

          if(event.srcElement.id == "lstDays_0")

            {

	            if(event.srcElement.checked == true)

	            {

	            for(var i=0;i<lstDays.rows.length+1;i++)

	              {

	                if( document.forms[0].elements[i].type =="checkbox" )

	                

                        {

	                        if(document.forms[0].elements[i].checked== false)

	                        {

		                       document.forms[0].elements[i].checked =true;

	                        }

                        }

	              }

			

	            }

	            

	            else

	            {

	              for(var i=0;i<lstDays.rows.length+1;i++)

	              {

	                 if( document.forms[0].elements[i].type =="checkbox" )

                        {

	                        if(document.forms[0].elements[i].checked== true)

	                        {

		                       document.forms[0].elements[i].checked =false;

	                        }

                        }

	              }

	            

	            }

            }

            else

            {

                for(var i=0;i<lstDays.rows.length;i++)

	              {

	                 if( document.forms[0].elements[i].type =="checkbox" )

                        {

	                                if(document.forms[0].elements[i+1].checked== false)

	                                {

		                              

		                                document.forms[0].elements['lstDays_0'].checked = false;

		                                 break;

	                                }

	                                else

	                                {

	                                    

	                                    document.forms[0].elements['lstDays_0'].checked = true;

	                                }

                        }

	              }

            

            }

     

       }
 

    </script>
 
 
 
 

 <asp:CheckBoxList ID="lstDays" runat="server" Height="185px" onclick="check()">

       <asp:ListItem Value="0" >All</asp:ListItem>

            <asp:ListItem Value="1">Monday</asp:ListItem>

            <asp:ListItem Value="2">Tuesday</asp:ListItem>

            <asp:ListItem Value="3">Wednesday</asp:ListItem>

            <asp:ListItem Value="4">Thursday</asp:ListItem>

            <asp:ListItem Value="5">Friday</asp:ListItem>

            <asp:ListItem Value="6">Saturday</asp:ListItem>

            <asp:ListItem Value="7">Sunday</asp:ListItem>

        </asp:CheckBoxList>

Open in new window

0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

More often than not, we developers are confronted with a need: a need to make some kind of magic happen via code. Whether it is for a client, for the boss, or for our own personal projects, the need must be satisfied. Most of the time, the Framework…
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

744 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now