Radcombobox with EnableCheckAllItemsCheckBox

13 posts, 0 answers
  1. David
    David avatar
    4 posts
    Member since:
    Oct 2010

    Posted 23 Sep 2011 Link to this post

    I tried to set up Radcombobox with "check all" option which as  the demo did in the below link:

    http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/checkboxes/defaultcs.aspx


    However, even I set EnableCheckAllItemsCheckBox="true" , the check all option doesn't show at all.  Finally I copied the exact code  from the demo to my test page, the "check all" option still doesn't appear. another interesting thing is that I can't find the EnableCheckAllItemsCheckBox property in the properties window of visual studio. 


    Anything I did wrong? plus, how can I get " x item checked" information working in the Radcombobox if the concatenated string length of options being selected is longer than the width of combobox?  as the pic I attached in the image.
     

    any suggestions I would be really appreciated. 

    Thanks. 
  2. Jayesh Goyani
    Jayesh Goyani avatar
    2732 posts
    Member since:
    May 2010

    Posted 23 Sep 2011 Link to this post

    Hello,

    If you not get this type of property then take latest version of telerik and check.
    or.
    Upgrade your project.

    let me know if any concern.


    Thanks,
    Jayesh Goyani
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Amjad
    Amjad avatar
    36 posts
    Member since:
    Dec 2010

    Posted 05 Feb 2012 Link to this post

    Hello;

    i have the same problem here and am using 2011 Q2 telerik controls
    is this feature available for this version

    Thanks
  5. Jayesh Goyani
    Jayesh Goyani avatar
    2732 posts
    Member since:
    May 2010

    Posted 05 Feb 2012 Link to this post

    Hello Amjad,

    Yes it is available.

    Thanks,
    Jayesh Goyani
  6. Amjad
    Amjad avatar
    36 posts
    Member since:
    Dec 2010

    Posted 05 Feb 2012 Link to this post

    then am having the same problem as they do

    Any idea?
  7. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 05 Feb 2012 Link to this post

    Hello,

    EnableCheckAllItemsCheckBox property is added in Q2 2011 SP1 (version 2011.2.915). One suggestion is you can upgrade your telerik control's version.

    Thanks,
    Princy.
  8. Laura
    Laura avatar
    7 posts
    Member since:
    Feb 2012

    Posted 11 May 2012 Link to this post

    Hello,

    is it possible to implement a button or radio buttons to check/uncheck all items of a RadComboBox? Instead of using the functionality EnableCheckAllItemsCheckBox i want to place an extra button besides the ComboBox to check/uncheck all elements of it.

    Thanks
  9. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 15 May 2012 Link to this post

    Hi Laura,

    Here is the sample code that I tried to check/uncheck all items in a RadComboBox OnClientClick event of a Button.

    JS:
    <script type="text/javascript" >
        function OnClientClick()
         {
            var Combo = $find("<%=RadComboBox1.ClientID %>");
            var items = Combo.get_items();
            var checked = 1;
            for (var i = 0; i < Combo.get_items().get_count(); i++)
             {
                if (!items._array[i].get_checked())
                {
                    checked = 0;
                    break;
                }
             }
            if (checked==0)
             {
                for (var x = 0; x < Combo.get_items().get_count(); x++)
                {
                    items._array[x].check();
                }
             }
            else
             {
                for (var x = 0; x < Combo.get_items().get_count(); x++)
                {
                    items._array[x].uncheck();
                }
             }
         }
    </script>
     
    Hope this helps.

    Thanks,
    Princy.
  10. Laura
    Laura avatar
    7 posts
    Member since:
    Feb 2012

    Posted 15 May 2012 Link to this post

    Hi Princy,

    thanks, your solution is working fine, but if there are many elements in a RadComboBox it takes a lot of time to check/uncheck all. 
    So I tried it like this:

    <asp:CheckBox runat="server" ID="cb_Checkbox1" Enabled="true" OnClick="onchkStatusAllClick_Checkbox1(this)" />
      
    ...
      
    <script type="text/javascript">
      
     function onchkStatusAllClick_Checkbox1(parentChk) {
      
                    var combo = $find("<%= cbo_RadComboBox1.ClientID %>");
                    items = combo.get_items();
                    var count = items.get_count();
      
                    if (parentChk.checked == true) {
      
                        for (var itemIndex = 0; itemIndex < count; itemIndex++) {
                            var item = items.getItem(itemIndex); var chk = getItemCheckBox(item);
                            if (chk != null) { chk.checked = true; }
                        }
                        combo.set_text("All items checked");
                               combo.get_checkedItems().length = count;
                    }
      
                    if (parentChk.checked == false) {
      
                        for (var itemIndex = 0; itemIndex < count; itemIndex++) {
                            var item = items.getItem(itemIndex); var chk = getItemCheckBox(item);
                            if (chk != null) { chk.checked = false; }
                        }
                        combo.set_text("Choose an item");
                               combo.get_checkedItems().length = 0;
                    }
      
                }
      
     function getItemCheckBox(item) {
      
                    //Get the 'div' representing the current RadComboBox Item.
                    var itemDiv = item.get_element();
      
                    //Get the collection of all 'input' elements in the 'div' (which are contained in the Item).
                    var inputs = itemDiv.getElementsByTagName("input");
      
                    for (var inputIndex = 0; inputIndex < inputs.length; inputIndex++) {
      
                        var input = inputs[inputIndex];
      
                        //Check the type of the current 'input' element.
                        if (input.type == "checkbox") {
                            return input;
                        }
                    }
                }

    It works very fast setting all checkboxes in the RadComboBox to true or false. But it seems that the items are not being checked even though the checkboxes are checked.
    Therefore I tried to set the length of the checked items array to 0 if all items are unchecked. Similarly I wanted to set the length of the array to the number of all elements if all items are checked. In this way it is not working.

    Is there another way to check/uncheck all items that works faster or a possibility to set the number of checked items?
  11. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 16 May 2012 Link to this post

    Hi Laura,

    Only checking the CheckBox of the RadComboBoxItem does not check the item of the RadComboBox. Try the following javascript to check/uncheck the RadComboBoxItem.

    JS:
    <script type="text/javascript">
     function onchkStatusAllClick_Checkbox1(parentChk)
      {
            var combo = $find("<%= RadComboBox1.ClientID %>");
            items = combo.get_items();
            var count = items.get_count();
            if (parentChk.checked == true)
            {
               for (var itemIndex = 0; itemIndex < count; itemIndex++)
               {
                    var item = items.getItem(itemIndex);
                    if (item != null) { item.check(); }
               }
                combo.set_text("All items checked");
                combo.get_checkedItems().length = count;
            }
           if (parentChk.checked == false)
           {
             for (var itemIndex = 0; itemIndex < count; itemIndex++)
             {
               var item = items.getItem(itemIndex);
               if (item != null) { item.uncheck(); }
             }
                combo.set_text("Choose an item");
                combo.get_checkedItems().length = 0;
           }
      }
    </script>

    Hope this helps.

    Regards,
    Princy.
  12. Wellington
    Wellington avatar
    2 posts
    Member since:
    Sep 2014

    Posted 22 Jan 2015 in reply to Princy Link to this post

    Hi Guys,
    I know this post is old but follows my solution to this problem.

    Instead of using "onclick" i have used "OnClientItemChecked",  to capture action  of the checkbox.
    Follows solution created via JavaScript:

    <script type="text/javascript">
        function onchkStatusAllClick_Checkbox1(sender, eventArgs) {
            var combo = $find("<%= RCLinhaNegocio.ClientID %>");
            var parentChk = eventArgs.get_item();
            if (combo != null) {
                items = combo.get_items();
                var count = items.get_count();
                if (parentChk.get_text() == "Todos") {
                    if (parentChk.get_checked() == true) {
                        for (var itemIndex = 0; itemIndex < count; itemIndex++) {
                            var item = items.getItem(itemIndex);
                            if (item != null) { item.check(); }
                        }
                        combo.set_text("All items checked");
                        combo.get_checkedItems().length = count;
                    }
                    if (parentChk.get_checked() == false) {
                        for (var itemIndex = 0; itemIndex < count; itemIndex++) {
                            var item = items.getItem(itemIndex);
                            if (item != null) { item.uncheck(); }
                        }
                        combo.set_text("Choose an item");
                        combo.get_checkedItems().length = 0;
                    }
                }
                else {
                    if (parentChk.get_checked() == true) {
                        items = combo.get_items();
                        var count = items.get_count();
                        for (var itemIndex = 1; itemIndex < count; itemIndex++) {
                            var item = items.getItem(itemIndex);
                            if (item != null) { if (!item.get_checked()) return; }
                        }
                                      
                        item = items.getItem(0);
                        if (item != null) { item.check(); }
                    }
                    if (parentChk.get_checked() == false) {                    
                        var item = items.getItem(0);
                        if (item != null) { item.uncheck(); }
                    }
                }
            }
        }

    </script>
  13. Wellington
    Wellington avatar
    2 posts
    Member since:
    Sep 2014

    Posted 22 Jan 2015 in reply to Wellington Link to this post

    Complementing ...
    In the passage we define the combo can use "var combo = sender;" Instead of 'var combo = $ find ("<% = RCLinhaNegocio.ClientID%>");'
  14. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    1746 posts

    Posted 27 Jan 2015 Link to this post

    Hello,

    Thank you for sharing your solution with our community.

    Regards,
    Boyan Dimitrov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017