why ajax.actionlink not refresh the page? - ajax

Question

First,sorry to my bad english.
I don't understand why my page not refresh when i click on the delete user...
After the click i check in database and the user is delete but my page with table not refresh, i dont't understand.
My views is:
#model IEnumerable<SiteWebEmpty.Models.User.UserDisplay>
<script src="#Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/MicrosoftMvcAjax.debug.js")" type="text/javascript"></script>
<h2>Display User</h2>
<div id="deleteUser">
#using (Html.BeginForm())
{
<table class="tabledisplayUser" border="1">
<tr>
<th>Name FirstName</th>
<th>UserName</th>
<th>Roles</th>
<th>Choice</th>
</tr>
<tr>
<th>#Html.Editor("name")</th>
<th>#Html.Editor("username")</th>
<th>#Html.Editor("roles")</th>
<th>#Html.Editor("choice")</th>
</tr>
#foreach (var user in Model)
{
<tr>
<td class="action nameFirstName">#Html.DisplayFor(u => user.NameFirstName)</td>
<td class="action userName">#Html.DisplayFor(u => user.UserName)</td>
#if (user.Roles.Roles.Count.Equals(0))
{
<td>Nobody Role</td>
}
else
{
<td>#Html.DropDownList("Roles", user.Roles.Roles)</td>
}
<td>#Html.ActionLink("Edit", "Edit", new { UserName = user.UserName }) | #Ajax.ActionLink("Delete", "Delete", new { UserName = user.UserName },
new AjaxOptions()
{
HttpMethod = "POST",
Confirm = "Do you want delete this user?",
UpdateTargetId = "deleteUser"
})</td>
</tr>
}
</table>
}
</div>
My controller is:
public ActionResult DisplayUser()
{
List<UserDisplay> users=getAllUserInDB();
GetAllNameFirstNameLDAP(users);
return View(users);
}
public ActionResult Delete(String userName)
{
DeleteDB(userName);
if (!Request.IsAjaxRequest())
return RedirectToAction("DisplayUser");
else
{
List<UserDisplay> users = getAllUserInDB();
GetAllNameFirstNameLDAP(users);
return PartialView("DisplayUser",users);
}
}
I don't understand why it not working, thank you for your help !

Answer 1

UpdateTargetId = "deleteUser" means to refresh a DOM element with id="deleteUser". You don't have such element.
You have:
<div class="deleteUser">
which is not the same as:
<div id="deleteUser">
So replace the class with id and your table should refresh normally.