Can you just update a partial view instead of full page post?

Question

Is there a way to submit a partial view form in asp.net mvc without reloading the parent page, but reloading the partial view only to its new state? Similar to how knockout.js updates using data-bind.

My data table renders with a variable number of columns/names so I don't think knockout.js is an option for this one, so I am trying to use a partial view instead.

Answer 1

Not without jQuery.

What you would have to do is put your Partial in a div, something like:

<div id="partial">
    @Html.Partial("YourPartial")
</div>

Then, to update (for example clicking a button with the id button), you could do:

$("#button").click(function () {
   $.ajax({
       url: "YourController/GetData",
       type: "get",
       data: $("form").serialize(), //if you need to post Model data, use this
       success: function (result) {
           $("#partial").html(result);
       }
   });
})

Then your action would look something like:

public ActionResult GetData(YourModel model) //that's if you need the model
{
    //do whatever

    return View(model);
}

Answer 2

Actually, if your Partial has a child action method, you can post (or even use an anchor link) directly to the child action and get an Ajax-like affect. We do this in several Views.

The syntax is

@Html.Action("MyPartial")

The Child Action is

public ActionResult MyPartial()
{
    return PartialView(Model);
}

If your form posts to the child action

@using (Html.BeginForm("MyPartial"))
{
    ...
}

The Partial View will be updated with the partial view returned from the child action.

Jquery is still a legitimate way to update a partial. But technically, the answer to your question is YES.