athulamanage Ответов: 0

Как сделать проверку полей, размещенных на bootstrap modal в коде позади использования ASP .NET

Я хочу, чтобы проверить два поля в Bootstrap модальные и я хочу, чтобы закрыть модальное в ELSE часть из них IF состояние. Проблема в том, что модальный закрывается перед отображением MesssageBoxModal модальный. Пожалуйста, помогите мне решить эту проблему.

Мой файл .aspx (разметка) выглядит следующим образом

<pre><%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestPage.aspx.cs" Inherits="User_Control.TestPage" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <!-- Bootstrap Core CSS -->
    <link href="CSS/bootstrap.css" rel="stylesheet" />

    <!-- jQuery -->
    <script src="JS/jquery-3.2.1.js"></script>
    <link href="CSS/jquery-ui.css" rel="stylesheet" />
    <script src="JS/jquery-ui.js"></script>

    <!-- Bootstrap Core JavaScript -->
    <script src="JS/bootstrap.js"></script>

    <script>
        function openModal() {
            $('#exampleModal').modal({ hide: true });
        };
        function openMessageBox() {
            $('#MesssageBoxModal').modal({ hide: true });
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

        <!-- Button trigger modal -->
        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
            Launch demo modal
        </button>

        <!-- MAIM MODAL -->
        <asp:UpdatePanel ID="UpdatePanel2" runat="server">
            <ContentTemplate>
                <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div class="modal-header">
                                <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">×</span>
                                </button>
                            </div>
                            <div class="modal-body">
                                <asp:TextBox ID="txtPassword" runat="server"></asp:TextBox>
                                <asp:TextBox ID="txtConfirmPassword" runat="server"></asp:TextBox>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                                <asp:Button ID="Button1" runat="server" Text="Button" class="btn btn-primary" OnClick="Button1_Click" />
                            </div>
                        </div>
                    </div>
                </div>
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
            </Triggers>
        </asp:UpdatePanel>

        <!-- MESSAGE BOX MODAL -->
        <div id="MesssageBoxModal" class="modal" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Warning</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">×</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <p>Field validation is failed. Please check and retry.</p>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </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;
using CommonFunctions;

namespace User_Control
{
    public partial class TestPage : System.Web.UI.Page
    {
        DBTasks objDBTasks = new DBTasks();
        protected void Page_Load(object sender, EventArgs e)
        {
            
        }

        protected void Button1_Click(object sender, EventArgs e)
        {
            if (txtPassword.Text != txtConfirmPassword.Text)
            {
                //FAIL SCENARIO
                objDBTasks.manipulateData("insert into test_table values (now(), 'FAILED')");
                ScriptManager.RegisterStartupScript(Page, Page.GetType(), "MesssageBoxModal", "$('body').removeClass('modal-open');$('.modal-backdrop').remove();$('#MesssageBoxModal').hide();", true);
            }
            else
            {
                //SUCCESS SCENARIO
                //UPDATE DETAILS TO DATABASE CODE GOES HERE
                objDBTasks.manipulateData("insert into test_table values (now(), 'SUCCESS')");
                ScriptManager.RegisterStartupScript(Page, Page.GetType(), "exampleModal", "$('body').removeClass('modal-open');$('.modal-backdrop').remove();$('#exampleModal').hide();", true);
            }
        }
    }
}


Что я уже пробовал:

Пожалуйста, помогите мне избежать этой проблемы...

0 Ответов