<script>
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">×</a><strong>' + messagetype + '!</strong> <span>' + message + '</span></div>');
$("#alert_div").fadeTo(5000, 1000).slideUp(1000, function () {
$("#alert_div").slideUp(1000);
});
}
</script>
aspx page
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<asp:UpdatePanel runat="server" ID="upPopUps" UpdateMode="Conditional">
<ContentTemplate>
<div class="messagealert" id="alert_container">
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
aspx.cs
protected void btnDelete_Click(object sender, EventArgs e)
{
this.DeleteRecord(Convert.ToInt32(ViewState["ID"]));
// Insert Operation Logs
new UserLogs().InsertLog(Session["UserID"].ToString(), "User Deletion");
string messageType = "Success";
String message = "Successfully deleted...";
ScriptManager.RegisterStartupScript(this, this.GetType(), System.Guid.NewGuid().ToString(), "ShowMessage('" + message + "','" + messageType + "');", true);
}
reference:- https://www.webcodeexpert.com/2015/10/how-to-show-animated-bootstrap-alert.html
http://jsfiddle.net/g1rnnr8r/2/
https://www.aspsnippets.com/questions/191634/Bootstrap-alert-message-from-Server-Side-in-ASPNet/
https://stackoverflow.com/questions/23101966/bootstrap-alert-auto-close
No comments:
Post a Comment