Knockout MVC asp.net How to pass model back to the server

Question

I'm creating dynamic user input with knockout lib, BUT is when I submit the form the server side doesn't containts all the data I sent originally; i'm using a model that contains a IEnumerable property. The view specify the model is ReportModel, and also if I debug the JS i'm able to see the fieldValue change of all the fields correctly. I also use Html.BeginForm... to post the form, and IN MY ACTION ON THE CONTROLLER I JUST GET THE FIRST FIELD (ALWAYS THE FIRST), and if it helps, the value I got it's correct one (the one I set with the input)

my server side model:

public class ReportField
{
    public string fieldName {get; set;}
    public string fieldValue {get; set;}
    //other properties
}
public class ReportModel
{
    ReportFieldpublic List<ReportField> fields{ get; set; }
}

here is my client side code:

var viewModel = { reportModel: ko.mapping.fromJS(@Html.Raw(Json.Encode(Model)))};
$(document).ready(function () {
    ko.applyBindings(viewModel);
};

and the bind to the input:

//...foreach
<input type="text" data-bind="value: fieldValue, attr: { name: ' + fieldName() +'}" />

any help is welcome, thanks!

EDIT: when I bind the other properties of ReportField with hidden inputs, then on the server side I get all my fields and values correctly... why is that? how could I send all the fields to the server and avoid to use input hidden?

the controller action:

[HttpPost]
public ActionResult myAction(ReportModel model)
{
    foreach(ReportField field in model.fields){
        //model.fields only have one item when I not bind of the other properties on a hidden
    }
    //rest of the code
}

the form submit:

@using (Html.BeginForm("myAction", "Controller", FormMethod.Post, new { @id = "reportForm" }))

<input type="submit" value="OK" />

$(document).ready(function () {
     $("#reportForm").submit(function () {
                var valid = isValidForm();                    
                return valid;
            });
}

so far the solution is to bind some property of ReportField to a hidden input, then the action receive all the fields correctly... just wondering about is there another way.

You didn't add the actual submit, you just added the @using (Html.BeginForm(....)). What I'm asking is, show the line of code that looks like "<input type=submit.....>" — ganders

ganders ganders · Accepted Answer · 2014-01-07T18:58:59

Make your "myAction" a post. Then the model will be passed.

Knockout MVC asp.net How to pass model back to the server

2 Answers