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

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

1 Answer 135 Views
Ajax
This is a migrated thread and some comments may be shown as answers.
Shawn
Top achievements
Rank 1
Shawn asked on 29 Jan 2015, 06:26 PM
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;
        }
    }
}









1 Answer, 1 is accepted

Sort by
0
Shawn
Top achievements
Rank 1
answered on 30 Jan 2015, 02:34 PM
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.
Tags
Ajax
Asked by
Shawn
Top achievements
Rank 1
Answers by
Shawn
Top achievements
Rank 1
Share this question
or