Rank: Advanced Member
Groups: HelpDesk, Developers Joined: 11/9/2018(UTC) Posts: 564
Thanks: 122 times Was thanked: 26 time(s) in 25 post(s)
|
I really like the toastr popup in the admin. It's quick, concise and clear to the user. But what I've been struggling with is how to fire toastr on a page that saves the data but also needs to redirect back to a parent page. Toastr fires, but the redirect immediately kills it and the user does not see the popup. Finally figured out a way to do it today. Assume you have the following page structure: /Admin/RepairsDashboard /Admin/RepairsDashboard/SetRma /Admin/RepairsDashboard/SetRepairCost So basically a main (index) page that handles showing the data (in my case a grid), and two child pages that each perform a specific task. Concept applies to both child pages, so let's just focus on the SetRepairCost child page. When the user hits the 'Set Repair Cost' button in the parent page grid, a new view is rendered with a form for the user to enter their values. There is a Save (submit) button in the form. At the end of the [HttpPost] action method for the form, I simply return a Json object: Code:return Json("Repair cost order has been generated.");
In the SetRepairCost view, I have the form set to call a js function on success, like this: Code:@using (Ajax.BeginForm("SetRepairCost", "RepairsDashboard", null, new AjaxOptions() { OnSuccess = "savedSuccessfully" }, new { id = "setrepaircost-form" }))
And finally, a small snippet of js to handle both showing the toastr message, AND automatically firing a redirect after the toastr message disappears: Code:
function savedSuccessfully(data) {
toastr.success(data,
'Saved Successfully',
{
timeOut: 2000,
preventDuplicates: true,
// Redirect
onHidden: function() {
window.location.href = '@Url.Action("Index", "RepairsDashboard")';
}
});
}
Now, when the user hits the Save button, the page will show the toastr popup, and then automatically redirect back to the parent page.
|
1 user thanked Joe Payne2 for this useful post.
|
|
|
Forum Jump
You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.
Important Information:
The AbleCommerce Forums uses cookies. By continuing to browse this site, you are agreeing to our use of cookies.
More Details
Close