Questions tagged [ko.observablearray]

An observableArray is a knockout.js construct similar to a regular array in JavaScript, except that it allows for observing changes to the collection (e.g. adding and removing items).

An observableArray is a knockout.js construct similar to a regular array in JavaScript, except that it allows for observing changes to the collection (e.g. adding and removing items).

To quote the introduction from the relevant knockout.js documentation:

If you want to detect and respond to changes on one object, you’d use observables. If you want to detect and respond to changes of a collection of things, use an observableArray. This is useful in many scenarios where you’re displaying or editing multiple values and need repeated sections of UI to appear and disappear as items are added and removed.

var myObservableArray = ko.observableArray();    // Initially an empty array
myObservableArray.push('Some value');            // Adds the value and notifies observers

To see how you can bind the observableArray to a UI and let the user modify it, see the simple list example.

Key point: An observableArray tracks which objects are in the array, not the state of those objects.

228 questions
3
votes
3 answers

What's the correct way to assign an element by index to a knockout.js observableArray?

I've been looking at the documentation for knockout's observableArray, and I'm having trouble figuring out how to do one of the most fundamental things you can do with an array: assign a value by index. Things I've tried: (given oa =…
recursive
  • 83,943
  • 34
  • 151
  • 241
3
votes
1 answer

Faster foreach for IE

I use knockout foreach binding to populate UL. After every scroll to the end I fetch next 25 items and add it to the UL. Everything works really fast in Chrome (The best) and Firefox (little slower), but IE 10 takes around 8 times more to display…
3
votes
1 answer

Subscribe to observable property within observableArray in Knockout.js

I have an observableArray of objects in my view model, and within, I have an observable property on one key: var somefunc = function(sysMsgs) { // Create a VO from passed array $.each(sysMsgs, function(i, v) { var tMsg = { ... …
3
votes
1 answer

How do I get Knockout to bind the value of a select box to a property of a list item

How do I get Knockout to bind the value of a select box to a property of a list item? I have a ASP.NET MVC strongly typed view to IEnermerable of MyViewModel and MyViewModel is defined as public class MyViewModel{ public int Id {get;set;} …
3
votes
1 answer

knockout mapping + add to observable array

Fiddle can be found here. I'm adding to an observable array which is mapped by ko.mapping.fromJS(). In my view I'm building a URL by using a property on the array attr: { href: '/Users/Summary?userId=' + ID() }. If I want to add an item to the…
Colin
  • 2,442
  • 5
  • 24
  • 30
3
votes
1 answer

ko.DirtyFlag on ko.observableArray is always dirty

Inside my viewmodel I have following code: var self = this; self.Name = ko.observable(data.Name); var mapped = $.map(data.Addresses, function (item) { return new Address(item) }); self.AddressList = ko.observableArray(mapped); self.dirtyFlag = new…
3
votes
2 answers

Knockout bindings not working as expected for manipulating observable array

We have a view using Razor and Knockout.js that displays a form. Part of the form asks the user to enter a list of values, and we're using a ko.observablearray to keep track of them. This list is represented as a bunch of text boxes, one per value,…
Kevin
  • 14,655
  • 24
  • 74
  • 124
3
votes
1 answer

knockout observableArray push - not pushing to array

Having a go at playing with Knockout and I'm having problems with pushing to an observable array. My code below fetches some json data from the server on a button click, it's returning an array of objects. The first console.log consoles out fine,…
magenta placenta
  • 1,461
  • 7
  • 22
  • 34
3
votes
2 answers

Knockout.js: clear selection in select element

I need to clear the selection from a