Checkall checkbox in radcombobox should not clear other checkbox when click on text

[jaggu]

Hi,

I enabled EnableCheckAllItemsCheckBox="true". When i click on check all text area its unchecking all other checked items in radcombobox. It should not uncheck other checkbox items when i click on check all text area(not check all check box).


Thanks,
Mahesh

[Abhishek]

Hello Mahesh,

Can you please post your code to get exact solution to your problem. I think you have added  "AutoPostBack=True" or May be Ajax problem please check these two. For your reference go through the link : 
http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/checkboxes/defaultcs.aspx




Thanks,
Abhishek K

[jaggu]

Hi Abhishek,

Please find the attached image. you will get to know.

Thanks,
Mahesh

[Kalina]

Hi,

Please try adding this JavaScript on your page:

<script type="text/javascript">

function pageLoad() {
    $telerik.$(".rcbCheckAllItems").click(function (e) {
        e.stopPropagation();
    });
}
</script>

Regards,
Kalina
the Telerik team

[Abhishek]

Hello Kalina,
I tried your above posted javascript in my code but its not working. Please correct my code if i wrong some where.

<telerik:RadCodeBlock ID="rcbParentChildBlock" runat="server">
        <script type="text/javascript">
            function pageLoad() {
                debugger;
                $telerik.$(".rcbCheckAllItems").click(function (e) {
                    e.stopPropagation();
                });
            }
</script>
    </telerik:RadCodeBlock>
    <telerik:RadComboBox ID="rcbCheckAllItems" runat="server" CheckBoxes="true" EnableCheckAllItemsCheckBox="true"
        Width="300px" AutoPostBack="false">
        <Items>
                <telerik:RadComboBoxItem Text="Arts" />
                <telerik:RadComboBoxItem Text="Biographies" />
                <telerik:RadComboBoxItem Text="Children's Books" />
                <telerik:RadComboBoxItem Text="Computers Internet" />
                <telerik:RadComboBoxItem Text="Cooking" />
                <telerik:RadComboBoxItem Text="History" />
                <telerik:RadComboBoxItem Text="Fiction" />
                <telerik:RadComboBoxItem Text="Mystery" />
                <telerik:RadComboBoxItem Text="Nonfiction" />
                <telerik:RadComboBoxItem Text="Romance" />
                <telerik:RadComboBoxItem Text="Science Fiction " />
                <telerik:RadComboBoxItem Text="Travel" />

        </Items>
    </telerik:RadComboBox>

I will wait for your reply.

Thanks,
Abhishek K

[Kalina]

Hello Abhishek,

Indeed, the workaround that I have provided here is not precise enough - please accept my apologies for this.
Currently I am researching for another solution, but I am afraid that this will take some more time.
I will update this thread once I find something of interest.
Thank you for your patience.

Greetings,
Kalina
the Telerik team

[Abhishek]

Hello kalina and Mahesh,

I have solved above scenario of multiple check box selection inside the Radcombobox using JavaScript.
Please have one look.

JavaScript:

<script type="text/javascript">
function onCheckBoxClickClass(chk, combo) {

               var combo;
               if (combo == 'rcbClassGroup') {
                   combo = $find("<%= rcbClassGroup.ClientID %>");
               }

               cancelDropDownClosing = true;
               //holds the text of all checked items
               var text = "";
               //holds the values of all checked items
               var values = "";
               //get the collection of all items
               var items = combo.get_items();
               //enumerate all items
               for (var i = 0; i < items.get_count(); i++) {
                   var item = items.getItem(i);
                   //get the checkbox element of the current item
                   var chkMultipleSelectclass = $get(combo.get_id() + "_i" + i + "_chkMultipleSelectclass");
                   if (chkMultipleSelectclass.checked) {
                       text += item.get_text() + ",";
                       values += item.get_value() + ",";
                   }
               }
               //remove the last comma from the string
               text = removeLastComma(text);
               values = removeLastComma(values);

               if (text.length > 0) {
                   //set the text of the combobox
                   combo.set_text(text);

               }
               else {
                   //all checkboxes are unchecked
                   //so reset the controls
                   combo.set_text("");
               }
           }

           var cancelDropDownClosing = false;

           function removeLastComma(str) {
               return str.replace(/,$/, "");
           }

           function StopPropagation(e) {

               //cancel bubbling
               e.cancelBubble = true;
               if (e.stopPropagation) {
                   e.stopPropagation();
               }
           }

           function onDropDownClosing() {
               cancelDropDownClosing = false;
           }



           function selectAllNodes(chk, combo, chkItem, ChkNone) {

               var combo;
               var combobox;
               if (combo == 'rcbClassGroup') {
                   combobox = $find('<%=rcbClassGroup.ClientID %>');
               }


               var nestedTreeView = combobox.get_items()._array;
               for (var i = 0; i < nestedTreeView.length; i++) {
                   var chk1 = $get(combobox.get_id() + "_i" + i + "_" + chkItem);
                   chk1.checked = chk.checked;
               }
               if (chk.checked && combo == 'rcbClassGroup')
                   onCheckBoxClickClass(chk, combo);


               if (ChkNone != null) {
                   var chkNone = $get(combobox.get_id() + "_Header_" + ChkNone);
                   if (chkNone.checked)
                       chkNone.checked = false;
               }

               if (!chk.checked)
                   combobox.set_text("");

           }
       </script>

ASPX:

<telerik:RadComboBox ID="rcbClassGroup" runat="server" AllowCustomText="true" SkinID="DropDownList298x200"
        Filter="Contains" EmptyMessage="--Select--" AutoPostBack="false" DataSourceID="test" DataTextField="Name" DataValueField="ID" >
        <HeaderTemplate>
            <asp:CheckBox ID="ChkClassroomGroup" runat="server" Text="Select All" AutoPostBack="false"
                onClick="selectAllNodes(this,'rcbClassGroup','chkMultipleSelectclass',null)" />
        </HeaderTemplate>
        <ItemTemplate>
            <div onclick="StopPropagation(event)">
                <asp:CheckBox ID="chkMultipleSelectclass" runat="server" Text='<%#Eval("Name") %>'
                    AutoPostBack="false" onclick="onCheckBoxClickClass(this,'rcbClassGroup')" />
            </div>
        </ItemTemplate>
    </telerik:RadComboBox>
    <asp:XmlDataSource ID="test" DataFile="../XMLFiles/RadCombo.xml" runat="server"></asp:XmlDataSource>

kalina ill wait for your solution for the same scenario.

Regards,
Abhishek K

[Kalina]

Hi Abhishek,

Thank you for posting your solution for the community.

Currently we are researching for the best approach of defining the checkbox behaviour upon text click, but I am afraid that this will take us some more time.
I will update this forum thread once we find out something of interest.

Regards,
Kalina
the Telerik team