Question

wish to ajax/refresh the current page after quitting a jquery dialog.

I am having a View which contains a foreach loop, the data is pulled down from a model, there are 2 buttons edit/Delete for each loop. When I click on the ‘edit button’, a jquery UI Dialog is opened for editing, when I save the Jquery Dialog, what I want is to Ajax/Refresh the datas of the View after quiting the dialog (especially the edited datas of course).

How can I achieve it ?

Thanks

this is My View:

@{
    foreach (var item in Model) {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.IdPhoto)
            </td>
            <td>
                @Html.TextAreaFor(modelItem => item.Date)
            </td>
            <td>
                @Html.TextAreaFor(modelItem => item.Nom)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Category)
            </td>
            <td>
                @Html.CheckBoxFor(modelItem => item.Actif)
            </td>
            <td>

            <button class="Edit" value="@item.IdPhoto">Edit</button> 
            <button class="Delete" value="@item.IdPhoto">Delete</button> 

            </td>
        </tr>
    }
}

Answer 1

My suggestion is to load the information you want to edit/delete from a partial view using jQuery.
Then you can edit/delete from your jQuery dialog and when you are done, just reload that partial view using jQuery once again.

The code on your view would be something along the lines of:

$(document).ready(function () {

    LoadInfo(); //Loads partial view

});

function LoadInfo() {

    $.get("MyAction", { param1 : myParameter }, function (data) {

        $("#mydata").empty();
        $("#mydata").html(data);
    });
}

And in your Controller:

    [HttpGet]
    public virtual ActionResult MyAction(parameters)
    {
        var query = GetMyDataModel();

        return PartialView("_MyPartialViewName", query);
    }

And when you are done editing/deleting, you can call LoadInfo() once again and it will reload that part of your page.

Hope this helps.