validation not working with radtabstrip

[Alex]

I am using Windows XP, VS 2008 VB,  and Telerik controls 2009.2.826.35.  I have a radtabstrip with three tabs and a radmultipage with three pageviews.  There are fieldvalidators for the first two pages/tabs and a validationsummary for each.  The validation is triggered if the user clicks on the button at the bottom of the page but wont’t if they just click on the tab at the top.  If a user clicks on the second tab without all the required fields filled in on the first pageview, I want the validationgroup for that page to be triggered.  If the user gets as far as the second pageview and clicks on the third tab, without all required fields filled in, then I want the validationgroup for the second page to be triggered. 

 

I have set the “CausesValidation” property to true but it appears to have no effect.  I have also tried to use the javascript routine, UpdateValidationGroup (two slightly different variations), that I found in your forums but it gives me an error:  “Microsoft JScript runtime error: 'undefined' is null or not an object”.  It occurs on the line:  var selectedTab = tabstrip.get_selectedTab();.
Below is  my markup without the pageviews and the controls.

Thanks for any assistance,
Alex

<%@ Page Title="" Language="VB" MasterPageFile="~/Pages/MasterPages/MasterPage.master"
    AutoEventWireup="false" CodeBehind="ExamRegistration.aspx.vb" Inherits="SPPOnlineExamRegistrationWebApp.Pages_ExamRegistration" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <!--- <link href="../../Library/CSS/StyleSheet.css" rel="stylesheet" type="text/css" />   --->
    <form id="main" runat="server">
    <br />
    <p style="text-align: center">
        <asp:Label ID="Label1" runat="server" Font-Bold="True" Font-Size="Medium" Text="Pesticide Exam Registration"></asp:Label>
    </p>
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server" EnablePageMethods="True">
    </telerik:RadScriptManager>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadMultiPage1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                    <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="RadTabStrip1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                    <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
<script type="text/javascript" >
 function UpdateValidationGroup()
 {
  var tabStrip = $find("<%= RadTabStrip1.ClientID %>");
  var selectedTab = tabStrip.get_selectedTab();
  if(selectedTab != null)
   tabStrip.ValidationGroup = selectedTab.get_value();
 }
</script>

    <telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1"
        SelectedIndex="0" BorderStyle="None" Font-Size="Medium" Skin="WebBlue" Height="19px" CausesValidation="true"
        Width="441px" AutoPostBack="True" OnClientTabSelected="UpdateValidationGroup" ValidationGroup="ExamRegistration"  >
        <Tabs>
            <telerik:RadTab runat="server" PageViewID="rpvExamRegistration" Text="Exam Registration"
                SelectedIndex="0" Selected="True" onclick="UpdateValidationGroup()" Value="ExamRegistration" >
            </telerik:RadTab>
            <telerik:RadTab runat="server" PageViewID="rpvContactInformation" Text="Contact Information"
                SelectedIndex="1" onclick="UpdateValidationGroup()" Value="ContactInfo" >
            </telerik:RadTab>
            <telerik:RadTab runat="server" PageViewID="rpvConfirmation" Text="Confirmation" SelectedIndex="2">
            </telerik:RadTab>
        </Tabs>
    </telerik:RadTabStrip>

[Cori]

Hello Alex,

First off, you should handle the OnClientTabSelecting event, since you can cancel it and stop the selection. Next you're event handler should look something like this:

function UpdateValidationGroup(sender, args){
    args.set_cancel(!Page_IsValid);
}

It will cancel the selection if the page didn't validate.

I hope that helps.

[Alex]

Thanks for your reponse Cori.  I have changed my markup as you recommended (see below)

function UpdateValidationGroup(sender, args)
 {
    args.set_cancel(!Page_IsValid);
 }
</script>



    <telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1"
        SelectedIndex="0" BorderStyle="None" Font-Size="Medium" Skin="WebBlue" Height="19px" CausesValidation="true"
        Width="441px" AutoPostBack="True" OnClientTabSelecting="UpdateValidationGroup" ValidationGroup="ExamRegistration"  >

However, I am still getting the same error on the args.set line :   "Microsoft JScript runtime error: 'undefined' is null or not an object".  What am I missing here?

Thanks for your assistance,
Alex

[Manivannan]

Hi Alex,

I'm facing the same situation, you were stated below.

Did you got any solution for this ?

Awaiting for your reply