Solved

.Net Checkboxlist select all javascript

Posted on 2008-10-13
5
704 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
ID: 22708725
<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
ID: 31505782
Love your work

Thanks for the fast response. Worked perfectly
0
 
LVL 5

Expert Comment

by:varungd
ID: 22709038
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
ID: 22709112
your welcome
0
 
LVL 5

Expert Comment

by:varungd
ID: 22709758
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

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
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…

863 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

22 Experts available now in Live!

Get 1:1 Help Now