Knockout没有从帖子发送对象列表

时间:2016-08-21 16:39:05

标签: c# asp.net-mvc knockout.js

我有一个C#对象,如

public class MyModel
{
    public string ZipCode { get; set; }
    public DateTime DateOfEvent { get; set; }

    public List<Children> Applicants { get; set; }

    public string SelectedChoice { get; set; }

}

public class Children
{
    public string CoverageFor { get; set; }
    public DateTime dateOfBirth { get; set; }

}

然后我的html就是这样。

            <div class="control-group span4">
                <label class="control-label" for="4">County</label><select name="county" id="4" data-bind="options: county, optionsText:'County', value:selectedCounty, optionsValue: 'FIPSCountyCode' ,  optionsCaption: 'Choose...'"></select>

            </div>
        </div>
@*--------------------------------------- some more things --------------*@
            <div class="row-fluid dependent " data-bind='foreach: applicants'>
                       <div class="control-group span4">
                        <label class="control-label" for="5">
                            Coverage
                            for
                        </label>
                        <select name="coverageFor" id="5" data-bind="options: coverages, value:coverageFor, optionsText:'name', optionsCaption: 'Choose...'"></select>
                    </div>
                    <div class="control-group span4">
                        <label class="control-label" for="6">
                            Date of
                            Birth
                        </label>

                        <input id="6" placeholder="MM/DD/YYYY" class="input-small" data-date-blur="true" data-regex="^((\d{0,2})|(\d{1,2}/?\d{0,2})|(\d{1,2}/?\d{1,2}/?\d{0,4}))$"
                               type="text" data-bind="value: dateofBirth"/>



                    </div>
                    @*<a href='#' data-bind='click: $parent.removeApplicant, enable: $root.applicants().length > 1'>Remove</a>*@
                    <!-- ko if: $index() != 0 -->
                    <a href='#' data-bind="click: $root.removeApplicant">Remove</a>
                    <!-- /ko -->

            </div>

然后我的脚本就像跟随

$(function () {
    viewModel.zipCode.subscribe(function (value) {
        $.get("/api/xx/GetCounties?zipCode=" + value, null, viewModel.county, 'json');
    }.bind(this));
});


var ViewModel = function () {
    var self = this;

    self.zipCode = ko.observable();
    self.dateOfEvent = ko.observable();
    self.isValidZip = ko.observable(false);
    self.selectedChoice = ko.observable();


    //Enrollment reasons
    self.enrollmentReasons = ko.observableArray(new Array());
    $.get("/api/myApi/GetEnrollmentReason", null, self.enrollmentReasons, 'json');

    //county from Zipcode subscribed
    self.county = ko.observableArray(new Array());
    $.get("/api/myApi/GetCounties?zipCode=" + self.zipCode, null, self.county, 'json');


    self.applicants = ko.observableArray(new Array());
    self.applicants.push(new Children());

    //$.get("/api/myApi/IsInServiceArea?zipCode=" + value, null, ViewModel.isValidZip, 'json');


    //operations
    self.addApplicant = function () { self.applicants.push(new Children()) };
    self.removeApplicant = function (Children) { self.applicants.remove(getaquoteapplicant) };

    self.save = function () {
        var m = ko.mapping.toJS(ko.utils.unwrapObservable(self));
        $.ajax({
            url: '/mypostingpage/start',
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            data: JSON.stringify(m),
            success: function (result) {
                alert(result);

            }
        });
    }

}

var Children= function () {
    var self = this;
    self.coverageFor = ko.observable();
    self.tobaccoUser = ko.observable();
    self.dateofBirth = ko.observable();

    self.coverages = ko.observableArray([
        { name: "Self" },
        { name: "Spouse/Life Partner" },
        { name: "Son" },
        { name: "Daughter" },
        { name: "Sibling" },
        { name: "Other Eligible Person" }
    ]);


};   

viewModel = new ViewModel();

ko.applyBindings(viewModel);

当我从通话中收到帖子时 在控制器上。

[System.Web.Mvc.HttpPost]
public ActionResult Start(MyModel model)  <------- has all the values but the Children's property values not in.
{

    //Stuff I will return 
}

当我回到MyModel时,它将拥有所有值,但是孩子们将显示我有多少孩子,但值没有改变。子项的所有属性都将具有默认值。

有谁知道如何才能让List属性正确补充水分?

1 个答案:

答案 0 :(得分:1)

您未在此选择

上提及optionValue
<select name="coverageFor" id="5" data-bind="options: coverages, value:coverageFor, optionsText:'name', optionsCaption: 'Choose...'"></select>

所以它会返回

coverageFor: { name: "self" }

这在您的服务器端无效,因为它期望string不是对象

替换为

<select name="coverageFor" id="5" data-bind="options: coverages, value:coverageFor, optionsText:'name', optionsValue:'name', optionsCaption: 'Choose...'"></select>