javascript - Knockout and bootstrap not binding -
i cannot value of bound data-bind. when try read value undefined.
i have setup fiddle here:
http://jsfiddle.net/tonymaloney1971/2qjhb5pw/5/
i think possibly problem in way have setup knockout binding:
$(document).ready(function () { var data = [{ postcodestart: "", postcodeend: "", mileage: "", notes: "" }]; add: function () { //this part not working this.postcodestart() === "" alert("how value of postcodestart"); if (this.postcodestart() === "" || this.postcodeend() === "" || this.mileage() === "") { alert("empty field"); } else this.journeylist.push({ postcodestart: this.postcodestart(), postcodeend: this.postcodeend(), mileage: this.mileage(), notes: this.notes() }); },
also, in fiddle notice
thanks
i've made modified fiddle gets data add , remove functions. general rule, not using this
make knockout work. side-note, douglas crockford makes fair case never using this
in talk class-free oop.
here's relevant html:
<button class="btn-success img-rounded" data-bind="click:$root.add"> <span class="glyphicon glyphicon-plus-sign" style="text-align:right"></span> </button> <button class="btn-danger img-rounded" data-bind="click:$root.remove"> <span class="glyphicon glyphicon-remove"></span> </button>
and viewmodel:
var viewmodel = { journeylist: ko.observablearray(data), add: function (data) { if (data.postcodestart === "" || data.postcodeend === "" || data.mileage === "") { alert("empty field"); } else { viewmodel.journeylist.push({ postcodestart: data.postcodestart, postcodeend: data.postcodeend, mileage: data.mileage, notes: data.notes }); } }, remove: function (data) { viewmodel.journeylist.remove(data); } };
updated: added style list eliminate bullets.
<ul data-bind="foreach: journeylist" style="list-style-type:none">
Comments
Post a Comment