Adding objects to an array and then showing in a table

Question

I'm trying to learn Knockout. In my little project, I want to type in a firstname, a surname, and add it to an array of 'people' objects - and then show the list in a table using a foreach.

https://jsfiddle.net/2pf07vdh/

I'm new to fiddler too, so don't think the knockout is loading (The little checkbox should hide and show stuff, but it's not), but with this, in my editor, I get an error:

knockout-3.4.1.js:72 Uncaught ReferenceError: Unable to process binding "foreach: function (){return People }"(…)

That's when the screen loads.

And then when I try add an object to my array, I get this:

knockout-3.4.1.js:14 Uncaught TypeError: Cannot read property 'length' of undefined(…)

Can anyone see why I'm struggling so much? I think maybe I can't declare the 'Person' object like this?

stackoverflow.com/questions/23085414/…

Mahi
– Mahi

2016-11-12 06:27:59 +00:00
Commented Nov 12, 2016 at 6:27 — Mahi
– Mahi, Commented Nov 12, 2016 at 6:27

user3297291 · Accepted Answer · 2016-11-13 14:44:06Z

1

In this line:

self.People = ko.observableArray([Person]);

you're creating an observable array with a reference to a class/function in it. If you want to create an actual person, you'll have to use the new keyword. Note that FirstName will still be undefined.

self.People = ko.observableArray([]); // Opt 1. Initialize as empty list
self.People = ko.observableArray([new Person()]); // Opt 2. With empty person inside

MySelected has the same error.

You'll also have to fix some unclosed HTML tags. Additionally, I'd advice you to put your Save and Delete methods in MyViewModel rather than window.

answered Nov 13, 2016 at 14:44

user3297291

23.5k4 gold badges33 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Adding objects to an array and then showing in a table

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related