Actualice la cuadrícula MVCContrib después de realizar una acción de fila

Question

Estoy usando MVCContrib principalmente para los aspectos de paginación, clasificación y filtrado. Mi cuadrícula contiene todas las direcciones en nuestra aplicación de lista de correo (solo backend). El usuario puede eliminar, activar e inactivar miembros de la lista, por lo que hay enlaces de acción para estas opciones en cada fila. Usando jQuery, estoy capturando ese clic y realizar otras cosas como se completa la notificación de visualización de la acción.

Debido a esto, el problema que tengo es cómo actualizar la cuadrícula después de realizar estas acciones para que el usuario pueda ver los resultados. En un eliminación, puedo ocultar la fila. ¿Qué puedo hacer por cuando una persona activa/desactiva un correo electrónico? ¿Simplemente use jQuery para actualizar el valor en la tabla que muestra el estado?

// Activate the email address
$(".ActivateLink").click(function() {
    var id = $(this).attr("href");
    var i = id.indexOf("#");
    id = id.substring(i + 1);
    $.ajaxSetup({ 'async': false });
    $.post("/List/Activate", { "id": id }, function(data) {
        $(".message").text(data.message).addClass("notice");
    }, "json");
    return false;
});

Mi acción del controlador:

    //
    // POST: /List/Activate
    [HttpPost]
    public ActionResult Activate(int id)
    {
        string message = String.Empty;
        db.ActivateEventEmail(id, ref message);
        return Json(new { message = message });
    }

Mi vista:

<%= Html.Grid(Model.EmailAddressList).Columns(column => {
    column.For("ImageActions").Named("").Sortable(false);
    column.For(a => (a.Email.Length > 30) ? String.Format("{0}...", a.Email.Substring(0, 30)) : a.Email).Encode(true).SortColumnName("Email").Named("Email Address");
    column.For(a => (a.ContactName.Length > 30) ? String.Format("{0}...", a.ContactName.Substring(0, 30)) : a.ContactName).Encode(true).SortColumnName("ContactName").Named("Contact Name");
    column.For(a => a.SignupDate).Named("Signup Date").Format("{0:d}").Attributes(@style => "text-align: right;");
    column.For(a => a.AccountStatus ? "Yes" : "No").SortColumnName("AccountStatus").Named("Active").Attributes(@style => "text-align: center;");
}).Sort(Model.GridSortOptions)
    .Attributes(@class => "table-list", style => "width: 100%;").RowAttributes(c => new MvcContrib.Hash(@class => "gridrow"))
%>

Answer 1

Bien, lo descubrí.

En primer lugar, tuve que agregar una llamada a una función que tendré más tarde en el código.

// Activate the email address
$(".ActivateLink").live('click', function() {
    var id = $(this).attr("href");
    var i = id.indexOf("#");
    id = id.substring(i + 1);
    $.ajaxSetup({ 'async': false });
    $.post("/List/Activate", { "id": id }, function(data) {
        refreshTable();
        $(".message").text(data.message).addClass("notice");
    }, "json");
    return false;
});

La acción del controlador anterior, no toco y la vista que tenía arriba, no toco. La nueva función JavaScript que creo es la siguiente:

    function refreshTable() {
        $.ajaxSetup({
            async: false,
            cache: false
        });
        $.get('<%= Url.Action("Index", "List", new { filterText = Model.FilterText, filterActive = Model.FilterActive, filterGroup = Model.FilterGroup }) %>',
        function(response) {
            $(".table-list").replaceWith(response)
        });
    };

Asegúrese de tener el cache: false ahí. IE le gusta extraer datos de la caché y realmente hacer un desastre de las cosas.

En mi acción de índice cambié de return View(emailListGrid); a

        if (Request.IsAjaxRequest())
            return PartialView("EmailMaint", emailListGrid);
        else
            return View(emailListGrid);