asp.net上的按钮事件引导警报

Question

我怎么能做一个代码，当我点击asp.net上的按钮，引导或消息框的警告消息出现？

protected void ButtonLogin_Click(object sender, EventArgs e) 
    { 
     //TextBoxEmail.Text = DateTime.Now.ToString(); 
     string UserName = TextBoxEmail.Text.Trim(); 
     string password = TextBoxPassword.Text.Trim(); 
     OracleConnection conn = new OracleConnection(strConnString); 
     conn.Open(); 

     sql = "select password from userlogin where USERNAME = '" + UserName + "' and password ='" + password + "' "; 
    cmd = new OracleCommand(sql, conn); 


    // orada=new OracleDataAdapter(com.CommandText,conn); 
    // cmd.CommandType = CommandType.Text; 
    dr = cmd.ExecuteReader(); 
    //dr.Read(); 

    if (dr.HasRows) 
    { 
     Label1.Text = ""; 
     Response.Redirect("Details.aspx"); 
    } 
    else 
    { 
     Label1.Text = "No data found..."; 
     conn.Close(); 
    } 

    } 

} 

以上，在其他部分：

else 
     { 
      Label1.Text = "No data found..."; 
      conn.Close(); 
     } 

当用户名和密码不匹配，我希望出现在网站上的自举警告或消息框：“密码不正确” 。我怎么能这样做？

Answer 1

为此，您需要引用引导链接和jQuery

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 

下一页在ASPX页面添加到您的头部分：

<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' 
      } 
      $('#<%=ButtonLogin.ClientID %>').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> 

在CS中的代码

protected void ShowMessage(string Message, MessageType type) 
    { 
     ScriptManager.RegisterStartupScript(this, this.GetType(), System.Guid.NewGuid().ToString(), "ShowMessage('" + Message + "','" + type + "');", true); 
    } 

现在在其他部分调用错误函数，在你也成功c一个使用该功能，通过改变消息类型

ShowMessage("Aww, password is wrong", MessageType.Error); 

Answer 2

HTML（母版）：

<div class="MessagePanelDiv"> 
    <asp:Panel ID="Message" runat="server" Visible="False"> 
     <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a> 
     <asp:Label ID="labelMessage" runat="server" /> 
    </asp:Panel> 
</div> 

ENUM：

public enum WarningType 
{ 
    Success, 
    Info, 
    Warning, 
    Danger 
} 

代码隐藏：

/// <summary> 
/// Shows a message based of type and message 
/// </summary> 
/// <param name="message">Message to display</param> 
/// <param name="type">ENUM type of the message</param> 

public void ShowMessage(string Message, WarningType type) 
{ 
    //gets the controls from the page 
    Panel PanelMessage = Master.FindControl("Message") as Panel; 
    Label labelMessage = PanelMessage.FindControl("labelMessage") as Label; 

    //sets the message and the type of alert, than displays the message 
    labelMessage.Text = Message; 
    PanelMessage.CssClass = string.Format("alert alert-{0} alert-dismissable", type.ToString().ToLower()); 
    PanelMessage.Attributes.Add("role", "alert"); 
    PanelMessage.Visible = true; 
} 

用法：

ShowMessage("<strong> Error! </strong> Error message to show", WarningType.Danger); 

编辑

CSS类：

.MessagePanelDiv 
{ 
    position:fixed; 
    left: 35%; 
    top:15%; 
    width:35%; 
} 

的Javascript计时器自动删除警报：

$(document).ready(function() { 
    window.setTimeout(function() { 
     $(".alert").fadeTo(1500, 0).slideUp(500, function() { 
      $(this).remove(); 
     }); 
    }, 3000); 
}); 

没有母版

<div class="MessagePanelDiv"> 
    <asp:Panel ID="Message" runat="server" CssClass="hidepanel"> 
    <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a> 
    <asp:Label ID="labelMessage" runat="server" /> 
    </asp:Panel> 
</div> 

CSS：

.hidepanel { 
    display: none; 
} 

代码隐藏：

labelMessage.Text = "Successfully updated." 
Message.CssClass = String.Format("alert alert-{0} alert-dismissable", Constants.WarningType.Success.ToString().ToLower()) 
Message.Attributes.Add("role", "alert") 

Answer 3

老问题，但对于那些只想要一个简单的解决方案。

你必须有一个母版页与 '主' 的ID的的ContentPlaceHolder

创建这个类：

public class BootstrapPage : Page 
{ 
    public enum WarningType 
    { 
     Success, 
     Info, 
     Warning, 
     Danger 
    } 

    public void ShowNotification(string message, WarningType type) 
    { 
     var mainContentHolder = Master.FindControl("main") as ContentPlaceHolder; 
     Panel notificationPanel = new Panel(); 
     { 
      LiteralControl closeButton = new LiteralControl(); 
      closeButton.Text = "<a href=\"#\" class=\"close\" data-dismiss=\"alert\" aria-label=\"close\">&times;</a>"; 

      Label notificationMessage = new Label() { Text = message }; 

      notificationPanel.Controls.Add(closeButton); 
      notificationPanel.Controls.Add(notificationMessage); 
     } 
     notificationPanel.CssClass = string.Format("alert alert-{0} alert-dismissable", type.ToString().ToLower()); 
     notificationPanel.Attributes.Add("role", "alert"); 

     mainContentHolder.Controls.AddAt(0, notificationPanel); 
    } 
} 

然后从BootstrapPage而不是System.Web程序使您的WebForm inheirt。 UI.Page

调用它需要的时候：

ShowNotification("Error: You can't do that!", WarningType.Error);