I am new to Bootstrap and struggling to know how to use Alerts in Web Forms (vb.net)!
I need a simple example of how to use Bootstrap Alert which will be hidden when the page is first displayed. And then on clicking a button the message (from the server side) to be shown in the Bootstrap Alert box and obviously make it visible. After few
seconds the message to be removed.
Similarly how do I validate the input fields (Dropdown list) to ensure that the user selects an item from the Dropdown list if no item selected then prompt the message in the Bootstrap Alert box (as above)
I am new to Bootstrap and struggling to know how to use Alerts in Web Forms (vb.net)!
I need a simple example of how to use Bootstrap Alert which will be hidden when the page is first displayed. And then on clicking a button the message (from the server side) to be shown in the Bootstrap Alert box and obviously make it visible. After few
seconds the message to be removed.
I want the server side page (in SaveFeedback method in vb.net) to send custom message e.g. "Could not Save" or
"all successful" to lblMsg and make the Alert visible. And then after few seconds the Alert to go away for which I assume I have the code in the header section:
I want the server side page (in SaveFeedback method in vb.net) to send custom message e.g. "Could not Save" or
"all successful" to lblMsg and make the Alert visible. And then after few seconds the Alert to go away for which I assume I have the code in the header section:
Imports WebApplicationVB.BootstrapClassA
Public Class bootstrapshowmessagescustom
Inherits System.Web.UI.Page
Protected Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
BootstrapAlert(lblMsg, "all successful", BootstrapAlertType.Success, True)
ScriptManager.RegisterClientScriptBlock(Me, Page.GetType, "script", "window.setTimeout(function() { document.getElementById('" & lblMsg.ClientID & "').style.display = 'none' },2000);", True)
'BootstrapAlert(lblMsg, "Could not Save", BootstrapAlertType.Success, True)
End Sub
End Class
Public Class BootstrapClassA
Public Enum BootstrapAlertType
Plain
Success
Information
Warning
Danger
Primary
End Enum
Public Shared Sub BootstrapAlert(MsgLabel As Label, Message As String, Optional MessageType As BootstrapAlertType = BootstrapAlertType.Plain,
Optional Dismissable As Boolean = False)
Dim style, icon As String
Select Case MessageType
Case BootstrapAlertType.Plain
style = "default"
icon = ""
Case BootstrapAlertType.Success
style = "success"
icon = "check"
Case BootstrapAlertType.Information
style = "info"
icon = "info-circle"
Case BootstrapAlertType.Warning
style = "warning"
icon = "warning"
Case BootstrapAlertType.Danger
style = "danger"
icon = "remove"
Case BootstrapAlertType.Primary
style = "primary"
icon = "info"
End Select
If (Not MsgLabel.Page.IsPostBack Or MsgLabel.Page.IsPostBack) And Message = Nothing Then
MsgLabel.Visible = False
Else
MsgLabel.Visible = True
MsgLabel.CssClass = "alert alert-" & style & If(Dismissable = True, " alert-dismissible fade in font2", "")
MsgLabel.Text = "<i class='fa fa-" & icon & "'></i>" & Message
MsgLabel.Focus()
Message = ""
End If
End Sub
End Class
Best Regards
Yong Lu
MSDN Community Support
Please remember to "Mark as Answer" the responses that resolved your issue.
Member
12 Points
82 Posts
Bootstrap Alerts
Mar 14, 2019 10:33 PM|Moodhi|LINK
I am new to Bootstrap and struggling to know how to use Alerts in Web Forms (vb.net)!
I need a simple example of how to use Bootstrap Alert which will be hidden when the page is first displayed. And then on clicking a button the message (from the server side) to be shown in the Bootstrap Alert box and obviously make it visible. After few seconds the message to be removed.
Similarly how do I validate the input fields (Dropdown list) to ensure that the user selects an item from the Dropdown list if no item selected then prompt the message in the Bootstrap Alert box (as above)
Star
11444 Points
2439 Posts
Re: Bootstrap Alerts
Mar 15, 2019 09:43 AM|Yohann Lu|LINK
Hi Moodhi,
You can refer the following sample.
Bootstrap Alert from ASP.NET Server Side
https://www.codeproject.com/Articles/1091641/Bootstrap-Alert-from-ASP-NET-Server-Side
Bootstrap alert in button event on asp.net
https://stackoverflow.com/questions/35823379/bootstrap-alert-in-button-event-on-asp-net
Best Regards
Yong Lu
MSDN Community Support
Please remember to "Mark as Answer" the responses that resolved your issue.
Participant
840 Points
497 Posts
Re: Bootstrap Alerts
Mar 15, 2019 11:21 AM|AddWeb Solution|LINK
$(document).ready(function(){ $('button').click(function(){ $('.alert').show() }) });This jsfiddle shows how you can show a bootstrap alert box on click
http://jsfiddle.net/g1rnnr8r/2/
You need to implement jquery's
show()method. The code you need to use is.Member
12 Points
82 Posts
Re: Bootstrap Alerts
Mar 15, 2019 12:00 PM|Moodhi|LINK
So in my client page (.aspx) I have the following code:
<div class="alert alert-danger">
<asp:Label ID="lblMsg" CssClass="alert alert-danger" runat="server"></asp:Label>
</div>
and while the css alert is set as follows:
.alert{
display: none;
}
so the Alert does NOT show up initially.
Now, when the user clicks the button in client page (.aspx) below:
<asp:Button ID="btnSubmit" class="btn btn-primary" runat="server" Text="Submit" onclick="SaveFeedback"/>
I want the server side page (in SaveFeedback method in vb.net) to send custom message e.g. "Could not Save" or "all successful" to lblMsg and make the Alert visible. And then after few seconds the Alert to go away for which I assume I have the code in the header section:
<script>
window.setTimeout(function () {
$(".alert-danger").fadeTo(500, 0).slideUp(500, function () {
$(this).remove();
});
}, 5000);
</script>
So what is the exact server side code to do the above?
Star
11444 Points
2439 Posts
Re: Bootstrap Alerts
Mar 18, 2019 02:58 AM|Yohann Lu|LINK
Hi Moodhi,
The following sample for your reference.
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Bootstrap Alert in ASP.Net Server-side</title> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script> <style> .alert { display: block; } </style> </head> <body> <form id="form1" runat="server"> <div> <asp:Button ID="Button1" runat="server" Text="Show Alerts" /> <br /> <br /> <asp:Label ID="lblMsg" runat="server" Visible="false"></asp:Label> </div> </form> </body> </html>Imports WebApplicationVB.BootstrapClassA Public Class bootstrapshowmessagescustom Inherits System.Web.UI.Page Protected Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click BootstrapAlert(lblMsg, "all successful", BootstrapAlertType.Success, True) ScriptManager.RegisterClientScriptBlock(Me, Page.GetType, "script", "window.setTimeout(function() { document.getElementById('" & lblMsg.ClientID & "').style.display = 'none' },2000);", True) 'BootstrapAlert(lblMsg, "Could not Save", BootstrapAlertType.Success, True) End Sub End Class Public Class BootstrapClassA Public Enum BootstrapAlertType Plain Success Information Warning Danger Primary End Enum Public Shared Sub BootstrapAlert(MsgLabel As Label, Message As String, Optional MessageType As BootstrapAlertType = BootstrapAlertType.Plain, Optional Dismissable As Boolean = False) Dim style, icon As String Select Case MessageType Case BootstrapAlertType.Plain style = "default" icon = "" Case BootstrapAlertType.Success style = "success" icon = "check" Case BootstrapAlertType.Information style = "info" icon = "info-circle" Case BootstrapAlertType.Warning style = "warning" icon = "warning" Case BootstrapAlertType.Danger style = "danger" icon = "remove" Case BootstrapAlertType.Primary style = "primary" icon = "info" End Select If (Not MsgLabel.Page.IsPostBack Or MsgLabel.Page.IsPostBack) And Message = Nothing Then MsgLabel.Visible = False Else MsgLabel.Visible = True MsgLabel.CssClass = "alert alert-" & style & If(Dismissable = True, " alert-dismissible fade in font2", "") MsgLabel.Text = "<i class='fa fa-" & icon & "'></i>" & Message MsgLabel.Focus() Message = "" End If End Sub End ClassBest Regards
Yong Lu
MSDN Community Support
Please remember to "Mark as Answer" the responses that resolved your issue.