Knockout.js Binding to dropdownlist -


trying bind data dropdown list,

    function emailtemplate(data) {         var self = this;         self.etid = ko.observable(data.email_template_id);         self.ettypeid = ko.observable(data.email_template_type_id);         self.ettitle = ko.observable(data.email_template_title);         self.etcontent = ko.observable(data.email_template_content);         self.etappyear = ko.observable(data.app_year);         self.etsubject = ko.observable(data.subject);         self.etactive = ko.observable(data.active);     }      function emailtemplateviewmodel() {         var self = this;         self.etlist = ko.observablearray();          var uri = '/admin/services/emailtemplateservice.svc/emailtemplates';         odata.read(uri, function (data, response) {             $.each(data.results, function (index, item) {                 self.etlist.push(new emailtemplate(item));             });         });     }     $(document).ready(function () {         ko.applybindings(new emailtemplateviewmodel());                 }); 

html markup:

 <select data-bind="options: etlist, value:etid, optionstext: 'ettitle' "class="dropdown"></select> 

when run got: uncaught error: unable parse bindings. message: referenceerror: etidis not defined; bindings value: options: etlist, value:etid, optionstext: 'ettitle'

when bind drop down list, how should bind value? , after binding, how should capture or create dropdown change event in knockout?

when working <select> options, value binding determine of options selected, you'll want observable in viewmodel (e.g. selectedtemplate) set to. observable automatically mapped actual object observable array. setting value: etid doesn't make sense since there's no etid in root viewmodel.

example: http://jsfiddle.net/antishok/968gy/

function emailtemplateviewmodel() {     var self = this;     self.etlist = ko.observablearray();     self.selectedtemplate = ko.observable();     // ... } 

html:

<select data-bind="options: etlist, value:selectedtemplate, optionstext: 'ettitle'" class="dropdown"></select> 

you might have intended to optionsvalue: 'etid' work less preferable approach (because observable's value set id instead of actual object)


Comments

Popular posts from this blog

monitor web browser programmatically in Android? -

Shrink a YouTube video to responsive width -

wpf - PdfWriter.GetInstance throws System.NullReferenceException -