Search code examples
c#asp.net-corerazor-pages

On submit form with partial to controller not back value from partial

I have form in Razor Page look like this (i remove not needed data):

<form class="form-group form-popup" 
    asp-action="Update"
    data-ajax="true"
    data-ajax-method="POST">
    @Html.AntiForgeryToken()     
    <div class="popup-section">                                         
        <partial name="_FailureCostPartial" model="@Model.CostEdit" />
    </div>
    
    <div class="text-center mt-5 popup-edit-buttons">
        <button class="btn form-success" type="button" onclick="SubmitForm('@popupId')">
            @Localizer.GetLocalizedString("button_Save")<i class="fas fa-check fa-fw"></i>
        </button>
        <button class="btn form-danger" type="button" data-dismiss="modal">
            @Localizer.GetLocalizedString("button_Cancel")<i class="fas fa-times fa-fw"></i>
        </button>
    </div>
</form>

Model put to this view look like this:

public class FailureEditViewModel
{
    public FailureForEditDto Failure { get; set; }
    public FailureCostEditViewModel CostEdit { get; set; }
    public List<SelectListItem> Suppliers { get; set; }
}

And _FailureCostPartial Look like this:

<div class="details-form-field">
    <label class="col-sm-5">@Localizer.GetLocalizedString(nameof(Model.WorkingHoursCost))</label>
    <div class="input-container col-sm-7">
        <input id="Failure_WorkingHoursCost" asp-for="WorkingHoursCost" value="@Model.WorkingHoursCost" />
        <span asp-validation-for="WorkingHoursCost" class="text-danger"></span>
    </div>
</div>
<div class="details-form-field">
    <label class="col-sm-5">@Localizer.GetLocalizedString(nameof(Model.GeneralCost))</label>
    <div class="input-container col-sm-7">
        <input id="Failure_GeneralCost" asp-for="GeneralCost" value="@Model.GeneralCost" />
        <span asp-validation-for="GeneralCost" class="text-danger"></span>
    </div>
</div>
<div class="details-form-field">
    <label class="col-sm-5">@Localizer.GetLocalizedString(nameof(Model.TravelCost))</label>
    <div class="input-container col-sm-7">
        <input id="Failure_TravelCost" asp-for="TravelCost" value="@Model.TravelCost" />
        <span asp-validation-for="TravelCost" class="text-danger"></span>
    </div>
</div>
<div class="details-form-field">
    <label class="col-sm-5">@Localizer.GetLocalizedString(nameof(Model.TotalFailureCost))</label>
    <div class="input-container col-sm-7">
        <input disabled="disabled" id="Failure_TotalFailureCostField" asp-for="TotalFailureCost" value="@Model.TotalFailureCost" />
        <span asp-validation-for="TotalFailureCost" class="text-danger"></span>
    </div>
</div>

And model for that partial is:

public class FailureCostEditViewModel
{
    public decimal WorkingHoursCost { get; set; }
    public decimal GeneralCost { get; set; }
    public decimal TravelCost { get; set; }
    public decimal TotalFailureCost { get; set; }
}

Now when i set value in input on my partial and i try submit form (from first view) to my Update method in controller back : enter image description here

What should i do to correct back data from partial for field model.CostEdit?

Solution

  • For each property of the complex type, model binding looks through the sources for the name pattern prefix.property_name. If nothing is found, it looks for just property_name without the prefix.For your receive model is a nested model,so you need prefix to distinguish the property.

    Try to add the name to the input element like:name="CostEdit.WorkingHoursCost" in your _FailureCostPartial.cshtml.