Postback on selecting Check All option

11 posts, 0 answers
  1. KC
    KC avatar
    18 posts
    Member since:
    Jan 2011

    Posted 07 Feb 2012 Link to this post

    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!

  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 07 Feb 2012 Link to this post

    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. KC
    KC avatar
    18 posts
    Member since:
    Jan 2011

    Posted 08 Feb 2012 Link to this post

    Thanks Princy. Thought as much. Is it possible to cause a postback in a clientside event when the "Check All" checkbox is checked?

  5. jumpstart
    jumpstart avatar
    479 posts
    Member since:
    Nov 2011

    Posted 09 Feb 2012 Link to this post

    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.
  6. KC
    KC avatar
    18 posts
    Member since:
    Jan 2011

    Posted 09 Feb 2012 Link to this post

    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!
  7. Cat Cheshire
    Cat Cheshire avatar
    128 posts
    Member since:
    Jun 2010

    Posted 12 Feb 2012 Link to this post


    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;
    }
  8. Keith
    Keith avatar
    12 posts
    Member since:
    Sep 2011

    Posted 12 Dec 2012 Link to this post

    "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
  9. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 12 Dec 2012 Link to this post

    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.
  10. Keith
    Keith avatar
    12 posts
    Member since:
    Sep 2011

    Posted 13 Dec 2012 Link to this post

    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
  11. Kalina
    Admin
    Kalina avatar
    918 posts

    Posted 18 Dec 2012 Link to this post

    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.
  12. Milad Doraki
    Milad Doraki avatar
    3 posts
    Member since:
    Jul 2013

    Posted 22 Jul 2013 Link to this post

     

    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>
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017