有没有办法将警报从内容发送到母版页？答案

【问题标题】：Is there a way to send Alerts from content to master page?有没有办法将警报从内容发送到母版页？
【发布时间】：2020-07-14 23:57:03
【问题描述】：

我正在寻找一种将消息从 ASP 中的 mi 内容页面发送到我的母版页的方法。我尝试使用引导程序中的 Alert 组件，但无法正常工作。

这是我目前的代码：

母版页

<Master Language="VB" AutoEventWireup="false" CodeBehind="MasterPage.Master.vb" Inherits="FoodBusinessManager.Master" %>
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>

    <style type="text/css">
        .messagealert {
            width: 100%;
            position: fixed;
             top:0px;
            z-index: 100000;
            padding: 0;
            font-size: 15px;
        }
    </style>
    <script type="text/javascript">
        function ShowMessage(message, messagetype) {
            var cssclass;
            switch (messagetype) {
                case 'Success':
                    cssclass = 'alert-success'
                    break;
                case 'Error':
                    cssclass = 'alert-danger'
                    break;
                case 'Warning':
                    cssclass = 'alert-warning'
                    break;
                default:
                    cssclass = 'alert-info'
            }
            $('#alert_container').append('<div id="alert_div" style="margin: 0 0.5%; -webkit-box-shadow: 3px 4px 6px #999;" class="alert fade in ' + cssclass + '"><a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a><strong>' + messagetype + '!</strong> <span>' + message + '</span></div>');
        }
    </script>

    <asp:ContentPlaceHolder ID="Head" runat="server"></asp:ContentPlaceHolder>
</head>
<body>

    <!-- Navbar -->
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
        <div class="navbar-header">
            <a class="navbar-brand" href="#">Food Business Manager</a>
        </div>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Seguridad
                    </a>
                    <div id="menu_Administracion" class="dropdown-menu" aria-labelledby="navbarDropdown">
                        <a id="drop_BackupRestore" class="dropdown-item" href="#">Backup & Restore</a>
                        <a id="drop_Bitacora" class="dropdown-item" href="Bitacora.aspx">Bitacora</a>
                        <a id="drop_Idiomas" class="dropdown-item" href="Idiomas.aspx">Administrar Idiomas</a>
                        <a id="drop_Perfiles "class="dropdown-item" href="AgegarPermisos.aspx">Agregar Perfiles</a>
                    </div>
                </li>
            </ul>
        </div>
        <ul class="nav navbar-nav navbar-right">
            <li><a href="#"><span class="fas fa-power-off"></span> Logout</a></li>
        </ul>
    </nav>

    <div>

     <asp:ContentPlaceHolder ID="Contenido" runat="server">
        <div class="messagealert" id="alert_container"></div>
     </asp:ContentPlaceHolder>

    </div>

</body>
</html>

我的内容页面是空的

内容页面后端

Public Class Default1
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        'Session.Add("test", "1")

        MostrarMensaje("Mensaje de Prueba", "Success")

    End Sub

    Protected Sub MostrarMensaje(Mensaje As String, Tipo As String)
        ScriptManager.RegisterStartupScript(Me.Master.Page, Me.Master.GetType, System.Guid.NewGuid().ToString, "ShowMessage('" & Mensaje & "','" & Tipo & "');", True)
    End Sub
End Class

我在这里试图实现的是实现某种消息组件来实现一次，并使用我的内容页面。我愿意接受其他方法:)

提前谢谢..

【问题讨论】：

你快到了，你只需要从警报类中删除fade in。见我的answer

标签： javascript html css asp.net vb.net

【解决方案1】：

我试过你的代码，你设法调用了 Javascript 方法，但你只需要从类中删除 fade in 以显示警报：

class="alert fade in ' + cssclass + '"

应该是：

class="alert ' + cssclass + '"

见：https://getbootstrap.com/docs/4.0/components/alerts/

【讨论】：

如此接近！ Thaks Selim，我删除了“淡入”，它起作用了。