CODEWITHSUNDEEP
asp.net-mvc
starskythehutch
starskythehutch

Reputation: 3338

Multiple forms in a complex view model - how can I bind just one of them?

I have a complex view model which contains a collection of other objects which are recursively rendered using editor and display templates.

Each of the items in the collection contains a form model that I would like to submit to a controller. Note, that I do not want to post the whole view model back again, just the form model.

My problem is that MVC renders each object as part of a collection, and I do not know how to bind a single object from the collection to an object in the controllers signature.

I know I can bind the whole lot back again using IEnumerable<Account>, but I am trying to create row level submissions rather than the whole page.

If anyone can point me in the right direction, or show me how this should be done in the MVC world (I come from web forms so have been somewhat spoiled) I'd appreciate it immensely.

I've included an example HTML fragment below and also the controller I would like to post to.

<form action="/Home/Index" method="post">
    <input id="Accounts_0__AccountName" name="Accounts[0].AccountName" type="text" value="Account 1" />
    <input id="Accounts_0__AccountId" name="Accounts[0].AccountId" type="hidden" value="dddf5ca7-f8de-4192-b63a-3548f891e293" />
    <input type="submit" value="Submit" />    
</form>                  

<form action="/Home/Index" method="post">
    <input name="Accounts[1].AccountName" type="text" value="Account 2" />
    <input id="Accounts_1__AccountId" name="Accounts[1].AccountId" type="hidden" value="95d75f76-16ef-4cf2-b1e7-5fad782002c5" />
    <input type="submit" value="Submit" />    
</form>

[HttpPost]
public ActionResult Index(Account accounts)
{
   ...
}

Upvotes: 5

Views: 3236

Answers (2)

starskythehutch
starskythehutch

Reputation: 3338

I solved the problem by adding a hidden field to the Editor Template that contains the account prefix and creating a custom model binder that uses the value of the hidden field as the name of the model. The default binder can then bind it as if it's a single form view rather than a collection of view models.

@model MvcApplication1.Models.Account

@using (Html.BeginForm("Submit", "Home"))
{           
    @Html.TextBoxFor(m => m.AccountName)
    @Html.HiddenFor(m => m.AccountId)
    @Html.ValidationMessageFor(m => m.AccountName)
    <input type="hidden" value="@ViewData.TemplateInfo.HtmlFieldPrefix" name="account.prefix" />
    <input type="submit" value="Submit" />
}

public override object BindModel(ControllerContext controllerContext, ModelBindingContext bindingContext)            
{                
    bindingContext.ModelName = controllerContext.HttpContext.Request.Form["account.prefix"];

    return base.BindModel(controllerContext, bindingContext);
}

Upvotes: 1

Darin Dimitrov
Darin Dimitrov

Reputation: 1039298

You could try setting the prefix in your editor template:

@model AppName.Models.Account
@{
    ViewData.TemplateInfo.HtmlFieldPrefix = string.Empty;
}
@using (Html.BeginForm("Index", "Home"))
{
    @Html.TextBoxFor(x => x.AccountName)
    @Html.HiddenFor(x => x.AccountId)
    <input type="submit" value="Submit" />  
}

which if I am not mistaken should generate:

<form action="/Home/Index" method="post">
    <input id="AccountName" name="AccountName" type="text" value="Account 1" />
    <input id="AccountId" name="AccountId" type="hidden" value="dddf5ca7-f8de-4192-b63a-3548f891e293" />
    <input type="submit" value="Submit" />    
</form>

Obviously you realize that by doing this you end up with invalid HTML (you will have multiple elements with the same id). A possible workaround would be to set the id manually:

@Html.TextBoxFor(x => x.AccountName, new { id = "some unique value like a GUID" })
@Html.HiddenFor(x => x.AccountId, new { id = "some unique value like a GUID" })

Another possibility would be to write a custom model binder for the Account type which would simply ignore the prefix when binding.

Upvotes: 4

Related Questions