Button Inside RadWindow Closes Window When Not Valid

6 posts, 0 answers
  1. Andrew
    Andrew avatar
    15 posts
    Member since:
    Mar 2015

    Posted 01 Sep 2015 Link to this post

    I am using RequiredFeildValidators inside a RadWindow but the btnAddDebtor1 click causes a postback closing the window even though the clientside validators are false.  What is the solution to this issue?

     

    <!DOCTYPE html>
     
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
     
        <script type="text/javascript">
     
            function GetRadWindow() {
                var oWindow = null;
     
                if (window.radWindow)
                    oWindow = window.radWindow;
                else if (window.frameElement && window.frameElement.radWindow)
                    oWindow = window.frameElement.radWindow;
                return oWindow;
            }
     
            function CloseModal() {
                var oWnd = GetRadWindow();
                if (oWnd) oWnd.close();
            }
     
        </script>
     
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />
     
        <div>
        <telerik:RadButton ID="btnAddDebtor" runat="server" Text="Add Debtor" ButtonType="StandardButton" CausesValidation="false">
            <Icon PrimaryIconCssClass="rbAdd" PrimaryIconLeft="4" PrimaryIconTop="4"></Icon>
        </telerik:RadButton>
     
        <telerik:RadWindowManager ID="RadWindowManager1" runat="server" EnableShadow="true">
            <Windows>
            <telerik:RadWindow ID="RadWindow_DebtorContent" runat="server" Width="700" Height="480" Modal="true" Behaviors="Close">
                <ContentTemplate>
                    <div class="form-horizontal" style="width:670px">
                        <br />
                       <div class="form-group">
                            <asp:Label runat="server" AssociatedControlID="Contact" CssClass="col-md-2 control-label">Contact</asp:Label>
                            <div class="col-md-10">
                            <telerik:RadTextBox runat="server" ID="Contact" CssClass="form-control" Width="240px"></telerik:RadTextBox>
                            <asp:RequiredFieldValidator runat="server" ID="rfContact" Display="Dynamic" ControlToValidate="Contact" CssClass="text-danger" ErrorMessage="Please provide Contact" ValidationGroup="Debtor"></asp:RequiredFieldValidator>
                            </div>
                        </div>
                        <br />
     
                        <telerik:RadButton ID="btnAddDebtor1" runat="server" Text="Add Debtor" ButtonType="StandardButton" ValidationGroup="Debtor" OnCommand="btnAddDebtor_Click">
                            <Icon PrimaryIconCssClass="rbAdd" PrimaryIconLeft="4" PrimaryIconTop="4"></Icon>
                        </telerik:RadButton>
                        <br />
                    </div>
                </ContentTemplate>
            </telerik:RadWindow>
            </Windows>
        </telerik:RadWindowManager>
        </div>
        </form>
    </body>
    </html>

    C#

      

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
     
    namespace Bookings
    {
        public partial class test : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
                RadWindow_DebtorContent.OpenerElementID = btnAddDebtor.ClientID;
            }
     
            public void btnAddDebtor_Click(object sender, CommandEventArgs e)
            {
                if (this.Page.IsValid)
                {
                    //Update Database
     
                    ScriptManager.RegisterStartupScript(this, GetType(), "close", "CloseModal();", true);
                }
            }
        }
    }

  2. Andrew
    Andrew avatar
    15 posts
    Member since:
    Mar 2015

    Posted 01 Sep 2015 Link to this post

    I have browsed the forum for a similar scenario with no luck. I would have thought this is a fairly common procedure. Open a window with some form controls, validate them client side then post them to the server and close the window. I must be missing a simple step, can you help?
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Andrew
    Andrew avatar
    15 posts
    Member since:
    Mar 2015

    Posted 01 Sep 2015 in reply to Andrew Link to this post

    All I am trying to do is postback after the clientside validation is true. Is there a simple amendment to t​he above code to make this work?
  5. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3595 posts

    Posted 01 Sep 2015 Link to this post

    Hello Andrew,

    This setup seems mostly fine and validation should work in it. Here are a few ideas you can try:

    Regards,

    Marin Bratanov
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  6. Andrew
    Andrew avatar
    15 posts
    Member since:
    Mar 2015

    Posted 02 Sep 2015 in reply to Marin Bratanov Link to this post

    I moved the RadWindow outside the RadWindowManager as you suggested shown below but I still have the same issue with the requiredfeildvalidator clientside validation. Submitting the button inside the radwindow briefly shows the clientside requiredfeildvalidator working but the radwindow then disappears even though Page.IsValid is not meet.

     

    <!DOCTYPE html>
     
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
     
        <script type="text/javascript">
     
            function GetRadWindow() {
                var oWindow = null;
     
                if (window.radWindow)
                    oWindow = window.radWindow;
                else if (window.frameElement && window.frameElement.radWindow)
                    oWindow = window.frameElement.radWindow;
                return oWindow;
            }
     
            function CloseModal() {
                var oWnd = GetRadWindow();
                if (oWnd) oWnd.close();
            }
     
        </script>
     
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />
     
        <div>
        <telerik:RadButton ID="btnAddDebtor" runat="server" Text="Add Debtor" ButtonType="StandardButton" CausesValidation="false">
            <Icon PrimaryIconCssClass="rbAdd" PrimaryIconLeft="4" PrimaryIconTop="4"></Icon>
        </telerik:RadButton>
     
            <telerik:RadWindow ID="RadWindow_DebtorContent" runat="server" Width="700" Height="480" Modal="true" Behaviors="Close">
                <ContentTemplate>
                    <div class="form-horizontal" style="width:670px">
                        <br />
                       <div class="form-group">
                            <asp:Label runat="server" AssociatedControlID="Contact" CssClass="col-md-2 control-label">Contact</asp:Label>
                            <div class="col-md-10">
                            <telerik:RadTextBox runat="server" ID="Contact" CssClass="form-control" Width="240px"></telerik:RadTextBox>
                            <asp:RequiredFieldValidator runat="server" ID="rfContact" Display="Dynamic" ControlToValidate="Contact" CssClass="text-danger" ErrorMessage="Please provide Contact" ValidationGroup="Debtor"></asp:RequiredFieldValidator>
                            </div>
                        </div>
                        <br />
     
                        <telerik:RadButton ID="btnAddDebtor1" runat="server" Text="Add Debtor" ButtonType="StandardButton" ValidationGroup="Debtor" OnCommand="btnAddDebtor_Click">
                            <Icon PrimaryIconCssClass="rbAdd" PrimaryIconLeft="4" PrimaryIconTop="4"></Icon>
                        </telerik:RadButton>
                        <br />
                    </div>
                </ContentTemplate>
            </telerik:RadWindow>
     
        </div>
        </form>
    </body>
    </html>

    C#

     

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
     
    namespace Bookings
    {
        public partial class test : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
                RadWindow_DebtorContent.OpenerElementID = btnAddDebtor.ClientID;
            }
     
            public void btnAddDebtor_Click(object sender, CommandEventArgs e)
            {
                if (this.Page.IsValid)
                {
                    //Update Database
     
                    ScriptManager.RegisterStartupScript(this, GetType(), "close", "CloseModal();", true);
                }
            }
        }
    }

  7. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3595 posts

    Posted 04 Sep 2015 Link to this post

    Hi Andrew,

    I tested the provided code again and it seems to work fine for me. I am attaching a short video so you can confirm if I am missing something.

    What I can suggest at this point is the following:

    • try moving the validator out of the content template
    • try adding this to your web.config:

      <appSettings>
          <add key="ValidationSettings:UnobtrusiveValidationMode" value="None" />
      </appSettings>
    • ensure there are no script errors on the page
    • try the sample I am also attaching here to see if it works and if so - compare it with your actual setup to find the difference
    • if this does not help you resolve the problem, open a support ticket and send us a small runnable project that showcases the problem so we can investigate it

    Regards,

    Marin Bratanov
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017