This is a migrated thread and some comments may be shown as answers.

Select / deselect all

6 Answers 142 Views
FormDecorator
This is a migrated thread and some comments may be shown as answers.
Barbaros Saglamtimur
Top achievements
Rank 1
Barbaros Saglamtimur asked on 15 May 2008, 01:30 PM
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.

6 Answers, 1 is accepted

Sort by
0
Georgi Tunev
Telerik team
answered on 17 May 2008, 07:53 AM
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
0
Barbaros Saglamtimur
Top achievements
Rank 1
answered on 17 May 2008, 10:20 PM
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
0
Barbaros Saglamtimur
Top achievements
Rank 1
answered on 18 May 2008, 08:51 PM
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?
0
Georgi Tunev
Telerik team
answered on 20 May 2008, 01:50 PM
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
0
Barbaros Saglamtimur
Top achievements
Rank 1
answered on 20 May 2008, 11:18 PM
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.
0
Martin
Telerik team
answered on 03 Jun 2008, 05:11 AM
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
Tags
FormDecorator
Asked by
Barbaros Saglamtimur
Top achievements
Rank 1
Answers by
Georgi Tunev
Telerik team
Barbaros Saglamtimur
Top achievements
Rank 1
Martin
Telerik team
Share this question
or