Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
90
Cancel Tab change using client-side script
posted

Is there a way to cancel the tab chage in the BeforeSelectedTabChange client-side event handler? I've looked through the documentation but can't sem to find it. I know that in the past (and for other controls) there were ways to cancel postbacks. This is basically what I am trying to do here.

I have the WebTab in a MS UpdatePanel. I have to enforce some validation on the first tab before the user can navigate to other tabs. I would like to handle this client-side to reduce the poastback delay time. If the data is not validated I want a JS alert box to display, then the tab change is basically ignored.

Parents
  • 28407
    posted

    Hi DreamKey,

    you can cancel the BeforeSelectedTabChange event with the folloiwng line of BLOCKED SCRIPT

      oEvent.cancel = true;

     

    <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

    <%@ Register Assembly="Infragistics2.WebUI.UltraWebTab.v7.3, Version=7.3.20073.1043, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb"
        Namespace="Infragistics.WebUI.UltraWebTab" TagPrefix="igtab" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>Untitled Page</title>

        <script id="igClientScript" type="text/javascript">
    <!--

    function UltraWebTab1_BeforeSelectedTabChange(oWebTab, oTab, oEvent){
     //Add code to handle your event here.
      oEvent.cancel = true;
     
    }
    // -->
    </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <igtab:UltraWebTab ID="UltraWebTab1" runat="server">
                <Tabs>
                    <igtab:Tab Text="tab 0">
                    </igtab:Tab>
                    <igtab:Tab Text="tab 1">
                    </igtab:Tab>
                    <igtab:Tab Text="tab 2">
                    </igtab:Tab>
                    <igtab:Tab Text="tab 3">
                    </igtab:Tab>
                </Tabs>
                <SelectedTabStyle BackColor="#FFC0C0">
                </SelectedTabStyle>
                <ClientSideEvents BeforeSelectedTabChange="UltraWebTab1_BeforeSelectedTabChange" />
            </igtab:UltraWebTab>
       
        </div>
        </form>
    </body>
    </html>
     

Reply Children
No Data