Adding a success message after deleting item, in MVC4

Question

I have a delete hyperlink shown on the screen:

UsersPartial VIEW:

<%: Ajax.ActionLink("Delete", "Delete", new { id = item.UserID }, new AjaxOptions { HttpMethod = "GET", UpdateTargetId = "tabs-users", InsertionMode = InsertionMode.Replace }, htmlAttributes: new { data_target = "#tabs-users" })%>

This calls a method in my controller

CONTROLLER

    [HttpGet]
    public PartialViewResult Delete(int id)
    {
        userManager.DeleteUser(id);
        ViewBag.Status = string.Format("User deleted ok, id: {0}", id);
        return PartialView("UsersPartial", userManager.GetUsers());
    }

In the above code, I return a PartialView, this works. I would like to also display a message at the top of this view, defined above in ViewBag.Status, but I only want it to show this div once this action is taken.

Also note, that my view I am returning to has is strongly typed:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<IEnumerable<LMS.Data.User>>" %>

Lastly, the status message I'd like to display is a div that I created into another partial view so I can show it throughout the site.

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<dynamic>" %>

<div id="status" class="statusok">
<%: ViewBag.Status %>
</div>

What's the proper way to do this?

score 3 · Answer 1 · answered Sep 19 '12 at 15:45

3

ViewBag.Status will be null until you assign a value to it, so you could just do a check for that in your view then display it:

@if(ViewBag.Status != null)
{
    <div id="status" class="statusok">
       @ViewBag.Status
    </div>
}

In subsequent calls that return the same view, simply set ViewBag.Status to null if you no longer wish it to show.

answered Sep 19 '12 at 15:45

Gavin Coates

1,366
1
20
44

Thank you, this did help me, however, the other answer was more complete and answered the 'best' way to do it. I'm sure I will use your answer in the future though, so thank you. – Steve Stokes Sep 19 '12 at 17:18

score 2 · Accepted Answer · edited May 23 '17 at 12:03

You cannot return 2 different partial views from a controller action. One approach you might use is to render the first partial to a string and then have your controller action return a JSON result with 2 properties - one containing the HTML partial and the other containing the message to display:

[HttpDelete]
public PartialViewResult Delete(int id)
{
    userManager.DeleteUser(id);
    return Json(new 
    {
        Partial = RenderPartialViewToString("UsersPartial", userManager.GetUsers()),
        StatusMessage = string.Format("User deleted ok, id: {0}", id)
    });
}

and then:

<%= Ajax.ActionLink(
    "Delete", 
    "Delete", 
    new { 
        id = item.UserID 
    }, 
    new AjaxOptions { 
        HttpMethod = "DELETE", 
        OnSuccess = "onDelete"
    }, 
    htmlAttributes: new { data_target = "#tabs-users" }
) %>

and then write the onDelete callback:

function onDelete(result) {
    $('#tabs-users').html(result.Partial);

    // TODO: instead of alerting display the message wherever you want
    // and using whatever plugin you want to make it look pretty
    alert(result.StatusMessage);
}

You will also notice that I have used the proper HTTP verb for this task - DELETE. Never use the GET verb to invoke controller actions that are modifying state on your server (such as deleting an entity).

Thank you, this was exactly what I was looking for. Thanks for the tip on the verb, didn't notice that until you pointed it out. Coming from webforms to mvc, I still have lots to learn. Thanks! — Steve Stokes, Sep 19 '12 at 17:18

Adding a success message after deleting item, in MVC4

2 Answers2