This is a migrated thread and some comments may be shown as answers.

Help canceling postback in OnClientSelectedIndexChanged

8 Answers 268 Views
ListBox
This is a migrated thread and some comments may be shown as answers.
Mark Taylor
Top achievements
Rank 1
Mark Taylor asked on 09 Sep 2009, 04:00 PM
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??

8 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 10 Sep 2009, 08:36 AM
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.
0
Veselin Vasilev
Telerik team
answered on 10 Sep 2009, 08:45 AM
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.
0
Francesco
Top achievements
Rank 1
answered on 22 Mar 2011, 11:05 AM
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;
        }
    }
}
0
Shinu
Top achievements
Rank 2
answered on 22 Mar 2011, 12:02 PM
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.
0
Francesco
Top achievements
Rank 1
answered on 22 Mar 2011, 12:29 PM
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
0
Shinu
Top achievements
Rank 2
answered on 23 Mar 2011, 10:41 AM
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.
0
Francesco
Top achievements
Rank 1
answered on 23 Mar 2011, 12:41 PM
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
0
Dustin
Top achievements
Rank 1
answered on 09 Feb 2012, 05:03 PM
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
Tags
ListBox
Asked by
Mark Taylor
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Veselin Vasilev
Telerik team
Francesco
Top achievements
Rank 1
Dustin
Top achievements
Rank 1
Share this question
or