Select / deselect all

7 posts, 0 answers
  1. Barbaros Saglamtimur
    Barbaros Saglamtimur avatar
    110 posts
    Member since:
    Jul 2012

    Posted 15 May 2008 Link to this post

    Hi,

    I have a checkbox list styled with FormDecorator. I would like to implement select/deselect functionality via javascript. How can I achieve this?

    Thanks in advance.
  2. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 17 May 2008 Link to this post

    Hi Barbaros,

    You can do this in the same way you do it with the standard asp:checkbox control:

    <script type="text/javascript"
        function test() 
        { 
            var chkbox = document.getElementById("chk1"); 
            chkbox.click(); 
        } 
     
    </script> 
    <telerik:RadFormDecorator ID="babatifurchiloto" runat="server" /> 
    <asp:CheckBox ID="chk1" runat="server" /> 



    All the best,
    Georgi Tunev
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Barbaros Saglamtimur
    Barbaros Saglamtimur avatar
    110 posts
    Member since:
    Jul 2012

    Posted 17 May 2008 Link to this post

    Wow I did not know .click() can be used like this. I have tried
    elements[i].checked = true;
    and no success. I will try it.
    Thanks
  5. Barbaros Saglamtimur
    Barbaros Saglamtimur avatar
    110 posts
    Member since:
    Jul 2012

    Posted 18 May 2008 Link to this post

    Ok it works as expected with IE7 but problems with FF.
    Here is the codes:
    ... script manger is on the page.
    ... RadFormDecorator in on the page styled Web20 and

     <asp:CheckBoxList ID="CheckBoxList1" runat="server">
                <asp:ListItem>deneme -1</asp:ListItem>
                <asp:ListItem>deneme -2</asp:ListItem>
                <asp:ListItem>deneme -3</asp:ListItem>
            </asp:CheckBoxList>
            <br />
            <input id="Button1" type="button" value="button" onclick="selectall();"/></div>

    javascript code is:
    <script language="javascript" type="text/javascript">
        function selectall()
        {
            x=document.getElementsByTagName("input");
            for (i=0;i<x.length;i++)
            {
                if (x[i].type=="checkbox")
                {
                    x[i].click();
                }
            }
        }
       
        </script>

    and the problem is; when I click button, button disappears and nothing changed over checkboxes (they must be checked, this works with IE). Then when I refresh page I see checkboxes are checked, and button appears again. When I click button again button disappears, and checkboxes remain checked. When I look error console of firefox I see
    Error: _2d has no properties
    Source File: http://localhost/StyleDeneme/ScriptResource.axd?d=MyshHI_NM2jATkLfM4lYySrHezTIGEAgya0j4a02rEBRLANmpRbQR5zh7_JgsAatq3tsfjy5CFHDUAcGSPz_1CdLrcICGwGUUTFBlZbFDDs1&t=7004989d
    Line: 178

    By the way if I remove RadFormDecorator  everything works fine.

    What is the problem?
  6. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 20 May 2008 Link to this post

    Hi barbaros

    You will also need to update the labels as well - I apologize for missing that part in my previous reply.

    Here is a modified version of your code:

       function selectall() 
       { 
           checkboxes = document.getElementsByTagName("input"); 
           labels = document.getElementsByTagName("label"); 
           for (i = 0; i < checkboxes.length; i++) 
           { 
               if(checkboxes[i].type == 'checkbox' && checkboxes[i].checked == false
               { 
                   checkboxes[i].setAttribute('checked''checked'); 
               } 
               else if(checkboxes[i].type == 'checkbox' && checkboxes[i].checked == true
               { 
                  checkboxes[i].checked = false
               } 
           } 
           for (i = 0; i < labels.length; i++) 
           { 
               if(labels[i].className == 'Default radfdCheckboxChecked'
               { 
                   labels[i].className = 'Default radfdCheckboxUnchecked'
               } 
               else 
               { 
                   labels[i].className = 'Default radfdCheckboxChecked'
               } 
           } 
       } 



    Sincerely yours,
    Georgi Tunev
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  7. Barbaros Saglamtimur
    Barbaros Saglamtimur avatar
    110 posts
    Member since:
    Jul 2012

    Posted 20 May 2008 Link to this post

    Thanks for your replay. We are almost done but there is an another problem. To re-produce problem (same problem occurs both on FF and IE) , replace your javascript code with mine and test this;
    1-run page, checkboxes are not selected
    2-if you push button select-deselect work fine but dont do that
    3-click first checkbox (or any other)
    4-than click button, this will select all
    5-now try to deselect first one (or which one you selected in step 3)
    you will see its state doesn't change on first click but second.

    And another problem for FF.

    Test this both with ie and ff
    1-run page, checkboxes are not selected
    2-push button and select all
    3-now deselect all of them with mouse click, not with button
    4-than push button to select all again
    5-try to deselect them with mouse click
    FF needs a second click while IE works fine.

    Any suggestions?

    Thanks in advance.
  8. Martin
    Admin
    Martin avatar
    585 posts

    Posted 03 Jun 2008 Link to this post

    Hi barbaros saglamtimur,

    Sorry for the delayed reply.

    We tried to put things to work, but it seems that this is both a browser behavior and some issue with FormDecorator. Please, allow us a few more days to think of a solution.

    Kind regards,
    Martin Ivanov
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017