I have a model that looks like this.
class Aspect {
Guid Id { get; set; }
string Name { get; set; }
string Description { get; set; }
// multiple other properties
}
In my View (ASP.NET MVC 3.0) I am trying to use the KnockoutJS mapping plugin. I call upon it like this. (Html Helpers listed beneath)
// attempt to bind any data we received from the server
var serverData = @Html.Interpret(Model);
// auto map the knockout attributes from the server data
var viewModel = ko.mapping.fromJS(serverData);
// apply the knockout binding to the viewModel
ko.applyBindings(viewModel, $("#__frmAspect")[0]);
// attach the jquery unobtrusive validator
$.validator.unobtrusive.parse("#__frmAspect");
viewModel.Save = function() {
// we will try to send the model to the server.
ko.utils.postJson(
$("#__frmAspect").attr('action'), { model: ko.toJS(viewModel) }
);
};
// bind the submit handler to unobtrusive validation.
$("#__frmAspect").data("validator").settings.submitHandler = viewModel.Save;
For the most part, this actually works. However, for whatever reason, it does not like the Name
field.
It creates it, mind you. If I place a breakpoint at postJson
in the knockout.js file, I can sit there and see that the ko.observable()
does exist. It just is not getting set by the input field.
Can anyone tell me why this might be?
My Html Helpers:
namespace System.Web.Mvc {
public static class KnockoutHelpers {
public static MvcHtmlString Interpret<TModel>(this HtmlHelper htmlHelper, TModel model) {
return new MvcHtmlString(model.ToJson());
}
}
public static string ToJson ( this object item ) {
return new System.Web.Script.Serialization.JavaScriptSerializer( ).Serialize( item );
}
}
Looks like we got this solved on the KO forums. Autocomplete was not firing the change event on the Name field.
Defined the data bind like: data-bind="value: Name, valueUpdate: 'blur'"
to make this work.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With