knockout-2.0

How can I bind a ko.observableArray of strings?

杀马特。学长 韩版系。学妹 提交于 2019-12-04 03:48:23
I'm trying to bind a ko.observableArray of strings to a template, but I'm unable to get the template to pick up changes in the strings inside the array. If I bind a set of objects instead of a set of strings, I get updates to the JSON, but they don't trigger anything until I actually change the first, non-array value. I'd prefer to find an array of strings, however, as I will be able to post the data model directly back to the server without any post-processing. How can I get the updates to my arrays of strings to trigger, and how can I ensure that they correctly trigger changes without having

How to build a textarea with character counter and max length?

独自空忆成欢 提交于 2019-12-04 02:58:08
Please consider this jsfiddle . It contains something along these lines: <textarea data-bind="value: comment, valueUpdate: 'afterkyedown'"></textarea> <br/><br/> <span data-bind="text: getCount, valueUpdate: ['afterkeydown','propertychange','input']"></span> characters??? And this JavaScript: var viewModel = function(){ var self = this; self.count = ko.observable(0); self.comment = ko.observable(""); self.getCount = function(){ var countNum = 10 - self.comment().length; self.count(countNum); }; } var viewModel12 = new viewModel(); ko.applyBindings(viewModel); I have a textarea where the

knockout - HTML href

人走茶凉 提交于 2019-12-04 00:07:32
I have a foreach loop that goes through an array (filesObservableArray). The array has a key/value with the key: URLPath. When I bind the array within the HTML, I would like to set the 'href=' value with the URLPath. I know this part is a fail, but conceptually, can you see what I'm trying to do? href="< span data-bind='text: URLPath'>" Or maybe I can use a 'databind="click: someCode(url)"' and within the someCode function, open the link? The url maps to either a document file (e.g., .doc) or an image file. Tips appreciated. Thanks! <tbody data-bind="foreach: $root.filesObservableArray"> <tr

Headless knockout viewmodel testing with mocha

早过忘川 提交于 2019-12-03 16:58:47
问题 I am trying to do headless testing of my knockout viewmodels. I purposely avoid dealing with any ui constructs in my viewmodel and leave the wireup to the html page. This works great in Jasmine since it runs in the browser, but when I switch to mocha, I end up running head-first into the last line on knockout which is: })(window,document,navigator); I've looked at using zombiejs which would be a nice alternative, but I don't see a good story on how to use it without changing the knockout

knockout unable to process binding “foreach”

断了今生、忘了曾经 提交于 2019-12-03 13:06:29
I'm new to Knockout and I'm building an app that's effectively a large-scale calculator. So far I have two instances of knockout running on one page. One instance is working perfectly fine, however the other one is entirely broken and just won't seem to register at all? Below is my Javascript, fetchYear is the function that works perfectly fine and fetchPopulation is the one that's completely broken. It doesn't seem to register "ageview" from the HTML at all and I can't figure out. The error: Uncaught ReferenceError: Unable to process binding "foreach: function (){return ageView }" Message:

Knockout-2.2.0, subscribe get value before change AND new value

强颜欢笑 提交于 2019-12-03 09:59:46
jsfiddle link: http://jsfiddle.net/T8ee7/ When I call Knockout's subscribe method is there a way I can get both the previous and new value? Right now, I can only call get these values separately. I want to trigger some code if the old and new value are different. I suppose I could do the following, but it can get messy... ( http://jsfiddle.net/MV3fN/ ) var sv = sv || {}; sv.PagedRequest = function (pageNumber, pageSize) { this.pageNumber = ko.observable(pageNumber || 1); this.numberOfPages = ko.observable(1); this.pageSize = ko.observable(pageSize || sv.DefaultPageSize); }; var _pagedRequest =

knockoutjs get element id through click event

北慕城南 提交于 2019-12-03 09:46:15
I'm using knockoutjs and I currently have something in my view that looks like this: <img id="myTab1" data-bind="click: pressedTab.bind($data, '#myTab1')" src="images/image1.png"></img> This allows me to get the element ID in my view model: pressedTab = function(tab){ console.log("Element ID: " + tab); } This writes: Element ID: #myTab1 However, it's too repetitive to send the name of the img id in the click event. Is there a way to send the img id without explicitly re-writing it? You actually can get access to the event object via a KO click handler. <button id="somebutton" data-bind="click:

Replace all elements in Knockout.js observableArray

允我心安 提交于 2019-12-03 09:19:11
I have an observableArray in my view model. After creating the vm I wish to completely replace the data the observableArray . Here's how I'm doing it: //Initial Setup var vm = {}; vm.roles = ko.observableArray([]); ko.applyBindings(vm); //....replace array later on.... vm.roles(["1", "2"]); This seems to be working fine, but I was concerned if this was incorrect and might lead to memory leaks. Can anyone conform if this is the preferred way to update an existing observableArray assuming you wish to replace all its data? I noticed observableArray does have a removeAll() method and wondered if

Headless knockout viewmodel testing with mocha

两盒软妹~` 提交于 2019-12-03 06:50:32
I am trying to do headless testing of my knockout viewmodels. I purposely avoid dealing with any ui constructs in my viewmodel and leave the wireup to the html page. This works great in Jasmine since it runs in the browser, but when I switch to mocha , I end up running head-first into the last line on knockout which is: })(window,document,navigator); I've looked at using zombiejs which would be a nice alternative, but I don't see a good story on how to use it without changing the knockout source itself. Any thoughts on how to approach this? Kato This is a topic currently on my radar as well. I

alternate row style with $index binding

℡╲_俬逩灬. 提交于 2019-12-03 04:16:24
I am having trouble getting an alternate-row css class applied to a knockout template with a foreach binding context. I am using knockout 2.1 with the available $index context variable. This is whats confusing: My Template <li class="row" data-bind="css: { alt: $index%2 }"></li> results in no alt classes being applied, however: <li class="row" data-bind="text: $index"></li> works properly and displays the row number. I struggled with this for a couple minutes and found that this question hadn't really been covered since the new binding context variables (like $index )had been introduced in