I am new at .NET mvc.
In a view "DisplayThings" I have something like:
@foreach (var thing in Model)
{
@Html.Partial("DisplayPartial", thing)
}
In the partial view "DisplayPartial" I have
@using (Ajax.BeginForm("Afunc", new AjaxOptions ()))
{
@Html.EditorFor(model => model.AstringThing)
@Html.EditorFor(model => model.AintThing)
<input type="submit" name="submit" value="Ajax Post" />
}
At the moment the "Afunc"-Action saves the model to the database and then redirects to a controller action to retrieve all "things" from the database and render the entire "Displaythings" View.
My question is: When i press one of the submitbuttons (There is one submitbutton for every "thing" i the list). I want only that partial view to reload/reflect on my change. I dont want to reload the entire "Displaythings" view. How do I do this? If I just return a partial view I lose everything else but that partial view.
If this is a bad approach please give me directions.
Update:
I am still doing something wrong as I get the partial view rendered in a new page. My controller :
public ActionResult Afunc(ThingModel thingmodel)
{
// do
return PartialView("DisplayPartial", thingmodel);
}
I have tried using UpdateTargetId and onsuccess both with the same result (A new page)
In the AjaxOptions
that your are simply now passing as new AjaxOptions
you can specify the target element using the UpdateTargetId
property:
<div id="unique_thing_id">
@using (Ajax.BeginForm("Afunc", new AjaxOptions { UpdateTargetId = 'unique_thing_id' }))
{
}
</div>
Above, a container with unique id for every "thing" is represented with <div id="unique_thing_id">
. This will be replaced with the repsonse of the request. Change Afunc
to render only the particular "thing" partial.