Help canceling postback in OnClientSelectedIndexChanged

9 posts, 0 answers
  1. Mark Taylor
    Mark Taylor avatar
    2 posts
    Member since:
    Jan 2009

    Posted 09 Sep 2009 Link to this post

    I am updating some custom controls and am having trouble figuring out how to cancel a postback on a RadListBox from the

    ClientSelectedIndexChanged

    handler. To explain...I have a page that contains a RadListBox, a RadTabStrip, and a RadMultiPage which are all linked. When the user selects a item from the RadListBox I use the ClientSelectedIndexChanged handler to check if the linked Tab/PageView already exists and if so then set them selected...if not then they are created and selected server-side. I have a prototype version which uses a RadTreeView that works fine using the set_postback( false ) method on the node in the OnClientNodeClicking handler...does anyone know how to do the same with a RadListBox??

  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 10 Sep 2009 Link to this post

    Hi Mark,

    One suggestion would be explicitly invoking postback in OnClientSelectedIndexChanged event of RadListBox after checking whether Tab/PageView already exists or not.

    JavaScript:
     
    <script type="text/javascript"
    function OnClientSelectedIndexChanged(sender, args) 
        if(args.get_item().get_text() == 'Australia'// Here check for whether Tab/PageView already exists 
        { 
        __doPostBack('<%= RadListBox1.ClientID %>'  , ''); // Invoke postback explicitly 
        } 
    </script> 
    Note: Also set AutoPostBack to False in this case.

    Please feel to share the comments,
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Veselin Vasilev
    Admin
    Veselin Vasilev avatar
    2992 posts

    Posted 10 Sep 2009 Link to this post

    Hello,

    I think Mark wanted to cancel the event - if so, you need to subscribe to the OnClientSelectedIndexChanging event and cancel it (eventArgs.set_cancel(true))

    Greetings,
    Veselin Vasilev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  5. Francesco
    Francesco avatar
    16 posts
    Member since:
    Mar 2011

    Posted 22 Mar 2011 Link to this post

    Hi, I have the same problem. I have made a simple exemple with the cancel call stop by client but the postback was cal. In this simple example, if you check/uncheck the label text is the item text, but if you ckick on the other item the event OnClientSelectedIndexChanging was call, but it don't stop and the postback call make label text as defaul text, that i wrong?

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="RadControlsWebApplication1.WebForm2" %>
      
    <!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>
      
        <script type="text/javascript">
            {            
                function stopPostBack(sender, eventArgs) {
                    eventArgs.set_cancel(true); // Cancel the postback  ??????
                }
            }   
        </script>
      
    </head>
    <body>
        <form id="form1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        </telerik:RadScriptManager>
        <div>
            <telerik:RadListBox ID="RadListBox1" runat="server" AutoPostBack="True" CheckBoxes="True"
                OnItemCheck="RadListBox1_ItemCheck" OnClientSelectedIndexChanging="stopPostBack">
                <Items>
                    <telerik:RadListBoxItem runat="server" Text="aaaa" />
                    <telerik:RadListBoxItem runat="server" Text="bbbb" />
                    <telerik:RadListBoxItem runat="server" Text="cccccc" />
                    <telerik:RadListBoxItem runat="server" Text="ddddddddddddd" />
                    <telerik:RadListBoxItem runat="server" Text="eeeeeeeeeeeeee" />
                </Items>
            </telerik:RadListBox>
        </div>
        <div>
            <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
        </div>
        </form>
    </body>
    </html>
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
      
    namespace RadControlsWebApplication1
    {
        public partial class WebForm2 : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
                Label1.Text = "WRONG!!!!";
            }
      
            protected void RadListBox1_ItemCheck(object sender, Telerik.Web.UI.RadListBoxItemEventArgs e)
            {
                Label1.Text = e.Item.Text;
            }
        }
    }
  6. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 22 Mar 2011 Link to this post

    Hello,

    This behavior is expected. The stopPostBack will cancel the event SelectedIndexChanged. When the user selects a checkbox using mouse or keyboard, then  OnClientItemChecking client events will fire. So in order to cancel the event, cancel the event attach OnClientItemChecking and cancel the event. Here is a sample code.

    Javascript::
    function OnClientItemChecking(sender, args)
       {
         args.set_cancel(true);
       }

    markup:
    <telerik:RadListBox ID="RadListBox1" runat="server" AutoPostBack="True" CheckBoxes="true" OnItemCheck="RadListBox1_ItemCheck"  OnClientItemChecking="OnClientItemChecking" >
      <Items>
        <telerik:RadListBoxItem runat="server" Text="aaaa" />
        <telerik:RadListBoxItem runat="server" Text="bbbb" />
        <telerik:RadListBoxItem runat="server" Text="cccccc" />
        <telerik:RadListBoxItem runat="server" Text="ddddddddddddd" />
        <telerik:RadListBoxItem runat="server" Text="eeeeeeeeeeeeee" />
      </Items>
    </telerik:RadListBox>

    Thanks,
    Shinu.
  7. Francesco
    Francesco avatar
    16 posts
    Member since:
    Mar 2011

    Posted 22 Mar 2011 Link to this post

    Thanks for giving me reply. I'm sorry but I think I explained badly. I would like to call server side only if user check/unchek but not for other event.  In your exemple the server side was not call in check/uncheck event because you stop him client side. In my exemple I would to stop onclientselectedindexchanging becuase I have seen that if the user click on item (without check/uncheck items) the server was call each time for nothing! can i do?
    very thank you
  8. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 23 Mar 2011 Link to this post

    Hello,

    You can achieve this by setting the RadListBox AutoPostBack property to False by using set_autoPostBack property like below.

    Javascript:
    <script type="text/javascript">
     function stopPostBack(sender, eventArgs)
      {
         sender.set_autoPostBack(false);
     }
    function OnClientItemChecking(sender, args)
       {
        sender.set_autoPostBack(true);
       }
    </script>
    and the corresponding aspx will be:
    <telerik:RadListBox ID="RadListBox1" runat="server" CheckBoxes="true" OnItemCheck="RadListBox1_ItemCheck" OnClientItemChecking="OnClientItemChecking" AutoPostBack="true" OnClientSelectedIndexChanging="stopPostBack" >
      <Items>
       <telerik:RadListBoxItem runat="server" Text="aaaa" />
       <telerik:RadListBoxItem runat="server" Text="bbbb" />
       <telerik:RadListBoxItem runat="server" Text="cccccc" />
       <telerik:RadListBoxItem runat="server" Text="ddddddddddddd" />
       <telerik:RadListBoxItem runat="server" Text="eeeeeeeeeeeeee" />
      </Items>
     </telerik:RadListBox>

    Thanks,
    Shinu.
  9. Francesco
    Francesco avatar
    16 posts
    Member since:
    Mar 2011

    Posted 23 Mar 2011 Link to this post

    thank a lot, your example is great!
    I ask you some little precisation. All wok is the property AutopostBack="True",  during the client event stopPostBack it change to false and the postback don't start. But if the default is FALSE and during the client event OnClientItemChecking it change to TRUE (the variable sender._autopostBack is set TRUE) but the postback don't start, why? is for a particolar page life cycle? Work only if default is TRUE?
    thanks
  10. Dustin
    Dustin avatar
    1 posts
    Member since:
    Jan 2012

    Posted 09 Feb 2012 Link to this post

    I just wanted to post a note of thanks to Shinu.  Your simple example was a very enlighting suggestion and I found it very helpful.
    -D
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017