Reputation: 146
In my HTML page there are 3 inputs. Using the user inputs, I wish to update elements of my page using KnockoutJS. This is the script I have written:
$(document).ready(function(){
function Task(data){
this.goal=ko.observable(data.goal);
this.type=ko.observable(data.type);
this.date=ko.observable(data.date);
console.log("Data"+ " " + data.goal);
}
var myViewModel=function(tasks){
var self=this;
self.tasks=ko.observableArray([{goal:"abc", type:"Intermediate", date:"12/13/1122"}]);
self.newGoalText=ko.observable("");
self.newTypeText=ko.observable("");
self.newDateText=ko.observable("");
self.addTask=function(){
self.tasks.push(new Task({goal:this.newGoalText(),type:this.newTypeText(), date:this.newDateText()}));
console.log(tasks);
self.newGoalText("");
self.newTypeText("");
self.newDateText("");
}//addTask function
}//viewModel
ko.applyBindings(new myViewModel())
});
The console.log tells me that the values are being obtained from user as expected. However, the "push" method on the tasks array seem to have no effect at all. Please guide me.
Upvotes: 1
Views: 46
Reputation: 500
If you are passing to your array a Task, you have to do everytime, so, when you initialize, you have to use [new Task({...}), new Task({...})]
Your console.log(tasks);
is not correct. This is showing your tasks variable, not your self.tasks, what i'm wondering you want to show, so be careful with your variable names and with (none)varname vs this.varname vs self.varname or you will have so much headaches...
finally here you are your example fully working.
I hope this help you.
Regards.
Upvotes: 1