Maarten B
Maarten B

Reputation: 165

ASP.NET MVC - Model not binding on Ajax.BeginForm in partial view

I have a partial View AddOptionPartial which uses a model OptionViewModel. This partial view is loaded when its parent, Build is loaded. This Build view uses the model BuildViewModel.

The partial is loaded in using using @{Html.RenderPartial("AddOptionPartial", new OptionViewModel());}.

The partial looks like this:

@model SurveyService.ViewModels.OptionViewModel

@{
    Layout = null;
}
@using (Ajax.BeginForm("AddOption", "Manage", new AjaxOptions { OnSuccess = "handleSavedOptionChoice(data)", HttpMethod = "Post" }))
{ 
    <div class="form-group">
        @Html.LabelFor(m => m.ChoiceText)
        @Html.TextBoxFor(m => m.ChoiceValue, new { @class = "form-control" })
    </div>
    @Html.LabelFor(m => m.ChoiceValue)
    <div class="form-group">
        <div class="btn-group" data-toggle="buttons">
            <label class="btn btn-primary">
                @Html.RadioButtonFor(m => m.ChoiceValue, 1) True
            </label>
            <label class="btn btn-primary">
            @Html.RadioButtonFor(m => m.ChoiceValue, 0) False
            </label>
            <label class="btn btn-primary active">
                @Html.RadioButtonFor(m => m.ChoiceValue, 2, true) Text
            </label>
        </div>
    </div>
    <button type="submit">Create</button>
}

As you can see, i am trying to post this form using an Ajax call. The call refers to this function:

public ActionResult AddOption(OptionViewModel model)
{
    ***content of function***
}

However, when debugging, the model is an OptionViewModel object containing no data. I can not find a reason for this on SO, can someone please advise?

Upvotes: 0

Views: 1033

Answers (4)

Carlos Moreno
Carlos Moreno

Reputation: 1

Change the parameter name to data

public ActionResult AddOption(OptionViewModel data)
{
// Do something here
}

Upvotes: -1

Maarten B
Maarten B

Reputation: 165

Error in the code found:

@Html.LabelFor(m => m.ChoiceText)
@Html.TextBoxFor(m => m.ChoiceValue, new { @class = "form-control" })

@Html.RadioButtonFor(m => m.ChoiceValue, 1) True

Setting multiple values on a single parameter causes that parameter to act like a list, which only creates a ModelState error and will never fill the model.

To anyone who encounters a similar problem in the future: Debug your controller function and have a look at the ModelState in the debugger.

Thanks to everyone who advised.

Upvotes: 0

RickL
RickL

Reputation: 3393

@{Html.RenderPartial("AddOptionChoicePartial", new OptionViewModel());} passes exactly that; a new, presumably empty, OptionViewModel.

You should either pass in a pre-populated model (from the parent BuildViewModel) like @{Html.RenderPartial("AddOptionChoicePartial", parentViewModel.SomeModel);} or construct the View Model from scratch in AddOptionChoice.

(Note also that you're calling "AddOptionChoicePartial" from Html.RenderPartial, but the Controller Action is named AddOptionChoice. They should match)

Also, in trying to recreate the model from your comments, you're using ChoiceText and ChoiceValue, which do not match OptionText and OptionValue.

Upvotes: 1

Ankita
Ankita

Reputation: 1456

Try this:

       @using (Ajax.BeginForm("AddOption", "Manage",null, new AjaxOptions { OnSuccess = "handleSavedOptionChoice(data)", HttpMethod = "Post" }))



            public ActionResult AddOptionChoice([System.Web.Http.FromBody]OptionViewModel model)
            {
                ***content of function***
            }

Upvotes: 1

Related Questions