Ajaxified Button and Custom Validator Won't fire client-side validation

2 posts, 0 answers
  1. Shawn
    Shawn avatar
    30 posts
    Member since:
    Jun 2014

    Posted 29 Jan 2015 Link to this post

    Hello,

    I'm having a lot of trouble figuring this out.  I have a web user control that loads inside a tabstrip tab.  This user control has a button on it.  When the user clicks on this button a RadPageView is loaded with another web user control as a modal popup window.  The modal window has several RadComboBoxes and a few RadTextBoxes.  I want to use a CustomValidator(s) to validate the combobox(s). If nothing has been selected the validation should fail.  The CustomValidator has the setting for ClientValidationFunction set for a JavaScript function.  I cannot get my code to execute the client-side validation function for the CustomValidator.

    If anyone can help me figure this out I'd really appreciate it.  I've been struggling with this for the past week. 

    Thanks.

    The button and the validation summary are ajaxified within the RadAjaxManager that resides in the Master Page for the application:
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" EnableAJAX="true" ClientIDMode="Static">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="btnAdd">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="btnAdd" />
                    <telerik:AjaxUpdatedControl ControlID="pnlValidatorSummary" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>

    This is the markup for the RadWindow:
    <telerik:RadWindowManager ID="rwmWindowManager" runat="server" EnableEmbeddedSkins="true" Skin="Metro" PreserveClientState="true">
        <Windows>
            <telerik:RadWindow ID="rdwAddNewAHU" runat="server" Modal="true" OnInit="rdwAddNewAHU_Init"
                Height="550" Width="600" Behaviors="Close" DestroyOnClose="true" ReloadOnShow="true" ShowContentDuringLoad="false" OnClientClose="OnClientClose">
                <ContentTemplate>
                    <telerik:RadMultiPage ID="rmpAddNewAHU" runat="server" SelectedIndex="0">
                    </telerik:RadMultiPage>
                </ContentTemplate>
            </telerik:RadWindow>
        </Windows>
    </telerik:RadWindowManager>
     
    <asp:Button ID="btnAddNewAHU" runat="server" OnClientClick="openwin();return false" Text="Add New AHU" Visible="false" />
     
    <telerik:RadScriptBlock ID="rsbInventory" runat="server">
        <script type="text/javascript">
            function openwin() {
                window.radopen(null, "rdwAddNewAHU");
            }
        </script>
    </telerik:RadScriptBlock>

    This is the code I use to load the RadPageView with the popup user control:
    private void LoadMyUserControl(string controlName, Control parent)
    {
        parent.Controls.Clear();
        RadPageView pageView = new RadPageView();
        UserControl ctrl = (UserControl)LoadControl(controlName);
        string userControlID = controlName.Split('.')[0];
        ctrl.ID = userControlID.Replace("/", "").Replace("~", "");
        pageView.Controls.Add(ctrl);
        parent.Controls.Add(pageView);
    }
     
    protected void rdwAddNewAHU_Init(object sender, System.EventArgs e)
    {
        int roleID = ApplicationInformation.GetRoleID();
         
     
        switch (roleID)
        {
            case 1: //Read Only
                btnAddNewAHU.Visible = false;
                break;
            default: //Suggesters and Approvers
                btnAddNewAHU.Visible = true;
                LoadMyUserControl(@"~/Modules/EspsMT/wucInventoryAddAHU.ascx", rmpAddNewAHU);
                rdwAddNewAHU.OpenerElementID = btnAddNewAHU.ClientID;
                break;
        }           
    }

    This is the markup for my popup user control "wucInventoryAddAHU.ascx":
    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="wucInventoryAddAHU.ascx.cs" Inherits="FACApps.Module.ESPSMT.wucInventoryAddAHU" %>
     
    <telerik:RadScriptBlock ID="rsbInventory" runat="server">
        <script type="text/javascript">
        <!--Initialize the controls on the popup window during close-->
        function OnClientClose(sender, eventArgs) {
            var comboBoxes = ['cmbBuildings',
                'cmbAHUManufacturers',
                'cmbAHUTypes',
                'cmbAHUConfigurations',
                'cmbAHUHousingVersion',
                'cmbAHUSpecialUse',
                'cmbAHULocation',
                'cmbAHUCanisters',
                'cmbAHUCommissionMonth',
                'cmbAHUCommissionYear'];
     
            var textBoxes = ['txtAHUUnitTag',
                'txtAHUAccessRequirements',
                'txtAHUComments'];
     
            for (i in comboBoxes) {
                ctrl = comboBoxes[i];
                comboBox = $find(ctrl);
                comboBox.trackChanges();
                comboBox.get_items().getItem(0).select();
                comboBox.updateClientState();
                comboBox.commitChanges();
            }
     
            for (i in textBoxes) {
                ctrl = textBoxes[i];
                textBox = $find(ctrl);
                textBox.set_value(null);
            }
     
            document.getElementById('vsValidationSummary').style.display = 'none';
        }
     
        function clientValidationBuildings(sender, args) {
            if ($find("<%=cmbBuildings.ClientID%>") > 0) {
                alert("valid");
                arg.IsValid = true;
                }
                else {
                alert("not valid");
                arg.IsValid = false;
                }
            }
        </script>
    </telerik:RadScriptBlock>
     
    <div style="margin-left: 10px;">
        <asp:Panel ID="pnlValidatorSummary" runat="server">
            <asp:ValidationSummary ID="vsValidationSummary" runat="server" Width="480px" BorderStyle="None" ForeColor="Red" HeaderText="* Please enter required values." ClientIDMode="Static" ValidationGroup="vgp"></asp:ValidationSummary>
        </asp:Panel>
    </div>
    <div style="margin-left: 10px;">
        <p>Select a building:</p>
     
        <telerik:RadComboBox ID="cmbBuildings" runat="server" Width="480" MaxHeight="300" OnDataBound="cmbBuildings_DataBound" AllowCustomText="false" ClientIDMode="Static" NoWrap="true" ValidationGroup="vgp"></telerik:RadComboBox>
        <asp:CustomValidator ID="cv" ValidateEmptyText="true" ClientValidationFunction="clientValidationBuildings" EnableClientScript="true" ControlToValidate="cmbBuildings" runat="server" ValidationGroup="vgp">*</asp:CustomValidator>
     
     
        <hr />
     
        <p>Enter New Air Handler Unit Details:</p>
     
        <asp:Label runat="server">Air Handling Unit Tag:</asp:Label><telerik:RadTextBox ID="txtAHUUnitTag" runat="server" ClientIDMode="Static"></telerik:RadTextBox><br />
     
        <asp:Label runat="server">Select Manufacturer:</asp:Label><telerik:RadComboBox ID="cmbAHUManufacturers" runat="server" MaxHeight="150" OnDataBound="cmbAHUManufacturers_DataBound" AllowCustomText="false" ClientIDMode="Static" NoWrap="true"></telerik:RadComboBox>
        <br />
     
        <asp:Label runat="server">Select Type:</asp:Label><telerik:RadComboBox ID="cmbAHUTypes" runat="server" MaxHeight="150" OnDataBound="cmbAHUTypes_DataBound" AllowCustomText="false" ClientIDMode="Static" NoWrap="true"></telerik:RadComboBox>
     
        <br />
     
        <asp:Label runat="server">Select Configuration:</asp:Label><telerik:RadComboBox ID="cmbAHUConfigurations" runat="server" MaxHeight="150" OnDataBound="cmbAHUConfigurations_DataBound" AllowCustomText="false" ClientIDMode="Static" NoWrap="true"></telerik:RadComboBox>
     
        <br />
     
        <asp:Label runat="server">Select Housing Version:</asp:Label><telerik:RadComboBox ID="cmbAHUHousingVersion" runat="server" MaxHeight="150" OnDataBound="cmbAHUHousingVersion_DataBound" AllowCustomText="false" ClientIDMode="Static" NoWrap="true"></telerik:RadComboBox>
     
        <br />
     
        <asp:Label runat="server">Special Use:</asp:Label><telerik:RadComboBox ID="cmbAHUSpecialUse" runat="server" MaxHeight="150" ClientIDMode="Static" NoWrap="true">
            <Items>
                <telerik:RadComboBoxItem Text="--Select--" Value="-1" />
                <telerik:RadComboBoxItem Text="No" Value="0" />
                <telerik:RadComboBoxItem Text="Yes" Value="1" />
            </Items>
        </telerik:RadComboBox>
     
        <br />
     
        <asp:Label runat="server">Select Location:</asp:Label><telerik:RadComboBox ID="cmbAHULocation" runat="server" MaxHeight="150" OnDataBound="cmbAHULocation_DataBound" AllowCustomText="false" ClientIDMode="Static" NoWrap="true"></telerik:RadComboBox>
     
        <br />
     
        <asp:Label runat="server">Access Requirements:</asp:Label><telerik:RadTextBox ID="txtAHUAccessRequirements" runat="server" Rows="1" ClientIDMode="Static"></telerik:RadTextBox><br />
     
        <asp:Label runat="server">Canisters:</asp:Label><telerik:RadComboBox ID="cmbAHUCanisters" runat="server" MaxHeight="150" ClientIDMode="Static" NoWrap="true">
            <Items>
                <telerik:RadComboBoxItem Text="--Select--" Value="-1" />
                <telerik:RadComboBoxItem Text="0" Value="0" />
                <telerik:RadComboBoxItem Text="3" Value="3" />
            </Items>
        </telerik:RadComboBox>
     
        <br />
     
        <asp:Label runat="server">Comments:</asp:Label><telerik:RadTextBox ID="txtAHUComments" runat="server" Rows="5" ClientIDMode="Static"></telerik:RadTextBox><br />
     
        <asp:Label runat="server">Test/Commission Month:</asp:Label><telerik:RadComboBox ID="cmbAHUCommissionMonth" runat="server" MaxHeight="150" OnDataBound="cmbAHUCommissionMonth_DataBound" AllowCustomText="false" ClientIDMode="Static" NoWrap="true"></telerik:RadComboBox>
     
        <br />
     
        <asp:Label runat="server">Year:</asp:Label><telerik:RadComboBox ID="cmbAHUCommissionYear" runat="server" MaxHeight="150" OnDataBound="cmbAHUCommissionYear_DataBound" AllowCustomText="false" ClientIDMode="Static" NoWrap="true"></telerik:RadComboBox>
     
        <br />
     
        <asp:Button ID="btnAdd" runat="server" Text="Enter Air Handler" OnClick="btnAdd_Click" CausesValidation="true" ValidationGroup="vgp" />
    </div>

    This is the server-side code for the button 'btnAdd':
    protected void btnAdd_Click(object sender, EventArgs e)
    {
        if (Page.IsValid)
        {
            int roleID = ApplicationInformation.GetRoleID();
            switch (roleID)
            {
                case 3: // Suggesters
                case 5: // Suggesters
                    //Perform some task
                    break;
                case 7: // Approvers
                case 9: // Approvers
                    //Perform some task
                    break;
            }
        }
    }









  2. Shawn
    Shawn avatar
    30 posts
    Member since:
    Jun 2014

    Posted 30 Jan 2015 Link to this post

    I believe I may have found a solution to this problem myself.  It seems that if I use "RadAjaxManagerProxy" instead of the "RadAjaxManager" then my problems go away.  I believe this has to do with having WebUserControls in my application.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top