How to use Toast notifications without postback
Question
All replies
-
User839733648 posted
Hi GeorgeClass,
In my opinion, toastr will not cause any postback.
You could refer to the link to check: https://github.com/CodeSeven/toastr
- toastr is a Javascript library for non-blocking notifications.
I've also tried the demo provided on my side and it do work well.
result:
Best Regards,
Jenifer
-
User839733648 posted
Hi GeorgeClass,
I suggest that you could use RegisterStartupScript() to call js function in your code behind.
Please refer to the following simple demo.
.aspx
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <link href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css" rel="stylesheet" /> <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.2/css/bootstrap.min.css" rel="stylesheet" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script> <script> function showContent() { toastr.options = { "closeButton": true, "debug": false, "progressBar": true, "preventDuplicates": false, "positionClass": "toast-top-right", "showDuration": "400", "hideDuration": "1000", "timeOut": "7000", "extendedTimeOut": "1000", "showEasing": "swing", "hideEasing": "linear", "showMethod": "fadeIn", "hideMethod": "fadeOut" } toastr["success"]("This is a message"); } </script> </head> <body> <form id="form1" runat="server"> <div> <asp:Button ID="Button1" runat="server" Text="Button" CssClass="btn btn-primary" OnClick="Button1_Click" /> </div> </form> </body> </html>code-behind.
protected void Button1_Click(object sender, EventArgs e) {
//Your operation Page.ClientScript.RegisterStartupScript(this.GetType(), "CallMyFunction", "showContent();", true); }result:
Best Regards,
Jenifer
