Telerik Forums / UI for ASP.NET AJAX
This is a migrated thread and some comments may be shown as answers.

Postback on selecting Check All option

10 Answers 440 Views
ComboBox
This is a migrated thread and some comments may be shown as answers.
KC
Top achievements
Rank 1
KC asked on 08 Feb 2012, 03:56 AM
Hi,

I would like to know if it is possible to cause a postback on selecting "Check All" option in the RadComboBox.

The documentation in this link says that the Check All checkbox "does" make a post-back, but am guessing thats a typo.

"Check All" CheckBox is not a RadComboBox item. It is a functionality implemented entirely on the client and does make a post-back to the server on checked / unchecked events, when AutoPostBack of RadComboBox is set to 'true'. 

Thanks!

10 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 2
answered on 08 Feb 2012, 05:13 AM
Hello,

When user checks the "Check All" checkbox - all RadComboBox items are marked as checked and there is no specific event for that.Check this forum thread for more.

Thanks,
Princy.
0
KC
Top achievements
Rank 1
answered on 08 Feb 2012, 06:10 PM
Thanks Princy. Thought as much. Is it possible to cause a postback in a clientside event when the "Check All" checkbox is checked?

0
Richard
Top achievements
Rank 1
answered on 09 Feb 2012, 11:31 PM
RadComboBox-CheckAll.png
KC:

I have verified that the documentation is indeed correct and that, when you have defined your RadComboBox with AutoPostBack="true", a postback will occur when selecting the "Check All" option in the RadComboBox. On the server-side, you will be able to access the collection of checked items in the manner of the ComboBox / CheckBoxes online demo.

If you cannot set AutoPostBack="true", I have found an alternative solution that forces a postback using the OnClientBlur event of the RadComboBox using JavaScript.

Default.aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Default" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<head runat="server">
    <title></title>
    <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        <Scripts>
            <%--Needed for JavaScript IntelliSense in VS2010--%>
            <%--For VS2008 replace RadScriptManager with ScriptManager--%>
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
        </Scripts>
    </telerik:RadScriptManager>
    <script type="text/javascript">
        function IsCheckAllSelected(sender, eventArgs) {
            var itemCount = sender.get_items().get_count();
            var selectedItemCount = sender.get_checkedItems().length;
            if (selectedItemCount == itemCount) {
                alert('check-all was checked')
                __doPostBack('RadComboBox1', 'Check All');
            }
            else {
                return 0
            }
        }
 
    </script>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    </telerik:RadAjaxManager>
    <div>
        <telerik:RadComboBox ID="RadComboBox1" runat="server" CheckBoxes="true" EnableCheckAllItemsCheckBox="true"
            Width="300px" OnClientBlur="IsCheckAllSelected" >
            <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>
    </div>
    <asp:Label ID="itemsClientSide" runat="server" Text=""></asp:Label>
    </form>
</body>
</html>

Default.aspx.cs:
using System;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
 
using System.Data;
using System.Configuration;
using System.Web.Security;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using Telerik.Web.UI;
 
public partial class Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (IsPostBack)
        {
            var target = Request.Params["__EVENTTARGET"];
            var argument = Request.Params["__EVENTARGUMENT"];
 
            // If the RadComboBox1 "check all" checkbox was selected, populate the list of checked items.
            if (target == "RadComboBox1" && argument == "Check All")
                ShowCheckedItems(RadComboBox1, itemsClientSide);
 
        }
     }
 
    private static void ShowCheckedItems(RadComboBox comboBox, Label label)
    {
        var sb = new StringBuilder();
        var collection = comboBox.CheckedItems;
 
        foreach (var item in collection)
            sb.Append(item.Text + "<br />");
 
        label.Text = sb.ToString();
    }
}

See attached image for screen display of postback.
0
KC
Top achievements
Rank 1
answered on 10 Feb 2012, 02:27 AM
Hi jumpstart,

Thank you for the response. Am not sure if your solution would apply to my scenario. I have AutoPostback enabled on the combobox but I don't need the postback to collect a list of selected items.

I have to enable a second combobox and perform a bunch of operations when Check All checkbox is selected. For that I need the actual server side event that is fired on checking "Check All". Thanks for providing a lead though!
0
Cat Cheshire
Top achievements
Rank 1
answered on 12 Feb 2012, 07:54 PM

You can attach a change() event handler at CheckAllItemsCheckbox  :
<title></title>
<script type="text/javascript" language="javascript">
function onLoad(sender) { 
    $telerik.$('.rcbCheckAllItemsCheckBox').change(function() {        
     __doPostBack();
                     
    });
} 
   
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <telerik:RadComboBox ID="RadComboBox1" runat="server"
            AutoPostBack="true" OnItemChecked="RadComboBox1_ItemChecked"
            CheckBoxes="true"  OnClientLoad="onLoad"
            EnableCheckAllItemsCheckBox="true" >
            <Items>
                <telerik:RadComboBoxItem Text="item 1" Value="1" />
                <telerik:RadComboBoxItem Text="item 2" Value="2" />
                <telerik:RadComboBoxItem Text="item 3" Value="3" />
            </Items>
        </telerik:RadComboBox>
        <asp:Label ID="lblPostBack" runat="server"></asp:Label>
   
    </div>
    </form>
protected void Page_Load(object sender, EventArgs e)
{
    lblPostBack.Text = this.RadComboBox1.Text;
}
   
protected void RadComboBox1_ItemChecked(object sender, Telerik.Web.UI.RadComboBoxItemEventArgs e)
{
    lblPostBack.Text = this.RadComboBox1.Text;
}
0
Keith
Top achievements
Rank 2
Iron
Veteran
answered on 12 Dec 2012, 07:53 PM
"I have verified that the documentation is indeed correct and that, when you have defined your RadComboBox with AutoPostBack="true", a postback will occur when selecting the "Check All" option in the RadComboBox."

Where did you find the documentation and what event captures this?

Best Wishes,
Keith
0
Princy
Top achievements
Rank 2
answered on 13 Dec 2012, 04:41 AM
Hi Keith,

When you have defined your RadComboBox with AutoPostBack="true", a postback will occur when selecting the "Check All" option in the RadComboBox. The server side event SelectedIndexChanged of the RadComboBox will fire onBlur of the RadComboBox.

Hope this helps.

Regards,
Princy.
0
Keith
Top achievements
Rank 2
Iron
Veteran
answered on 13 Dec 2012, 03:22 PM
I'll retest this, because I seem to recall it not working. 

Either way, it should fire off with a check event rather than requiring the end-user to step out of the combobox to get a selected change event onBlur.

Keith
0
Kalina
Telerik team
answered on 18 Dec 2012, 08:04 AM
Hello,

Please try the following code:
<head runat="server">
<title></title>
<script type="text/javascript" language="javascript">
    function onLoad(sender) {
        $telerik.$('.rcbCheckAllItemsCheckBox').change(function () {
            __doPostBack();
        });
        $telerik.$('.rcbCheckBox').change(function () {
            __doPostBack();
        });
    }   
 
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <telerik:RadScriptManager ID="manager" runat="server">
        </telerik:RadScriptManager>
        <telerik:RadComboBox ID="RadComboBox1" runat="server" 
            CheckBoxes="true" OnClientLoad="onLoad"
            EnableCheckAllItemsCheckBox="true">
            <Items>
                <telerik:RadComboBoxItem Text="item 1" Value="1" />
                <telerik:RadComboBoxItem Text="item 2" Value="2" />
                <telerik:RadComboBoxItem Text="item 3" Value="3" />
            </Items>
        </telerik:RadComboBox>
        <asp:Label ID="lblPostBack" runat="server"></asp:Label>
    </div>
    </form>
</body>

protected void Page_Load(object sender, EventArgs e)
{
    lblPostBack.Text = this.RadComboBox1.Text;
}

Regards,
Kalina
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Milad Doraki
Top achievements
Rank 1
answered on 22 Jul 2013, 07:12 AM

 

Hello,everybody.suggest me is for you :

 

 

 

<telerik:RadCodeBlock runat="server" ID="RadCodeBlock1">
<script type="text/javascript">
 
function onLoad(sender, arg) {
 
 $telerik.$($telerik.$(sender.get_dropDownElement()).find(".rcbCheckAllItems")).find(".rcbCheckAllItemsCheckBox").change(function () {
 
    __doPostBack(sender.get_id(),'');
 
 
});
 
}
 
</script>
</telerik:RadCodeBlock>
Tags
ComboBox
Asked by
KC
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 2
KC
Top achievements
Rank 1
Richard
Top achievements
Rank 1
Cat Cheshire
Top achievements
Rank 1
Keith
Top achievements
Rank 2
Iron
Veteran
Kalina
Telerik team
Milad Doraki
Top achievements
Rank 1
Share this question
or