knockout.js pushing items into observablearray

Question

I am trying to push objects for an existing array into a knockout observable array but am failing terrible. How do I get this code to work, and since this code sucks what is the 'proper' way of doing this. Thank you so much

<div data-bind="foreach: Bob">
    <div data-bind="text: $data">
    </div>
</div>
var Test = function(){
    var self= this;
    self.Init = function(name){
        self.Name = ko.observable(name);
    };
};
var ArrayOfTests = function() {
    var self = this;
    self.Init = function(tests){
        self.AllTests = ko.observableArray([]);
        for(var i = 0; i <=tests.length-1;i++)
        {
            self.AllTests.push(tests[i]);
        };
    };
};

var TestViewModule = function(){
    self.Bob = ko.observable();
    var temp = new ArrayOfTests();
    var tempTest = new Test();
    tempTest.Init('one2');
    temp.Init([tempTest,tempTest]);
    self.Bob= temp;
};
ko.applyBindings(new TestViewModule());
console.log(new TestViewModule());

The answer ended up being, I was adding a null item to the array making the array not work.

can you just explain what your objective, and please minimize "test" words — ebram khalil
– ebram khalil, Commented Dec 18, 2013 at 15:26

alexmac · Accepted Answer · 2013-12-18 15:36:55Z

1

You pass 'one2' string in Test.Init, but this method don't accept parameters:

var Test = function(){
    var self= this;
    self.Name = ko.observable();
    self.Init = function(data){
        self.Name(data);  
    };
};

Edit

I completly refactored your viewModel, because current implementation is not correct:

Html:

<div data-bind="with: Bob">
    <div data-bind="foreach: AllTests">
       <div data-bind="text: $data">
       </div>
    </div>
</div>

ViewModel:

var Test = function(){
    var self= this;
    self.Name = ko.observable(name);

    self.Init = function(name){
        self.Name(name);
    };
};

var ArrayOfTests = function() {
    var self = this;
    self.AllTests = ko.observableArray();

    self.Init = function(tests) {        
        for(var i = 0; i < tests.length; i++) {
            self.AllTests.push(tests[i].Name());
        };
    };
};

var TestViewModule = function(){
    var temp = new ArrayOfTests();
    var tempTest = new Test();
    tempTest.Init('one2');
    temp.Init([tempTest,tempTest]);

    self.Bob = ko.observable(temp);
};

ko.applyBindings(new TestViewModule());
console.log(new TestViewModule());

edited Dec 18, 2013 at 15:36

answered Dec 18, 2013 at 15:27

alexmac

19.7k7 gold badges64 silver badges74 bronze badges

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

2 Comments

gh9 Over a year ago

Cool!!why do you have to push the name of Test, instead of the test object itself? what if the test object had more properties then just the name?

alexmac Over a year ago

I thought that's what you want, of course you can push Test and use its observable properties.

Collectives™ on Stack Overflow

knockout.js pushing items into observablearray

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest