c# - Calculating a percentage from an observableArray with Knockout -

i have nested observablearray of tasks, grouped categories, , i'm trying calculate completion percentage. right now, think computed value way go, i'm trying use per code below. @ point i'm trying return observed field, , display in view.

the problem is, i'm not getting values returned. approaching wrong way?

@model dto  <div data-bind="with: tasksbycategory">     <div class="summarygroup" data-bind="template: {name: 'categorytemplate', foreach: tasksbycategory}"></div> </div>  @section scripts{     <script src="~/scripts/viewmodel/details.js"></script>     <script src="~/scripts/moment.js"></script>     <script src="~/scripts/bindings/date.js"></script>      <script type="text/html" id="categorytemplate">         <h3 data-bind="text: category_name, click:$parents[$parents.length - 1].showhide"></h3>          <div>             <span data-bind="text: pct"></span>             <div data-bind="template: {name:  'subcategorytemplate', foreach:  subcategories }" class="taskcategory"></div>             <div data-bind="template: {name:  'tasktemplate' , foreach: tasks } " class="taskcategory"></div>         </div>     </script>      <script type="text/html" id="subcategorytemplate">         <h4 data-bind="text: category_name, click: $parents[$parents.length - 1].showhide"></h4>         <div class="items" data-bind=" template: {name:  'tasktemplate' , foreach: tasks } "></div>     </script>      <script type="text/html" id="tasktemplate">         <table>             <tr>                 <td><strong data-bind=" text:task_name" style="font-weight:bold"></strong></td>                 <td>                     <select data-bind="options: $parents[$parents.length - 2].taskstates, optionstext:'state', optionsvalue:'id', value: task_state_id "></select>                 </td>             </tr>             <tr>                 <text data-bind="text:task_desc"></text>             </tr>         </table>     </script> } 

and script:

$(function () {     var viewmodel = new nriandtasksvm();     viewmodel.nri.push(new nri());     viewmodel.tasksbycategory.push(new tasksbycategory());     viewmodel.taskstates.push(new taskstates());     viewmodel.getnriandtasks();     ko.applybindings(viewmodel); })  function nriandtasksvm() {     var self = this;     self.nri = ko.observablearray([]);     self.tasksbycategory = ko.observablearray([]);     self.taskstates = ko.observablearray([]);     self.getnriandtasks = function () {         var self = this;         $.ajax({             type: "get",             url: '/nris/getnridetails',             datatype: 'json',             async: false,             data: { id: id },             success: function (data) {                 self.nri(data);                 self.tasksbycategory(data);                 self.taskstates(data.taskstates);             },             error: function (err) {                 alert(err.status + " : " + err.statustext);             }         });     };        };  function nri(data) {     var self7 = this;     self7.nri_id = ko.observable(data ? data.nri_id : "");     self7.cn_number = ko.observable(data ? data.cn_number : "");     self7.engineer = ko.observable(data ? data.engineer : "");     self7.date_start = ko.observable(moment(data ? data.date_start : "").format("mm/dd/yyyy"));     self7.completion_percentage = ko.observable(data ? data.completion_percentage : "");     self7.products = ko.observablearray(data ? data.products : "");     self7.new_chemicals = ko.observable(data ? data.new_chemicals : "");     self7.new_laborcodes = ko.observable(data ? data.new_laborcodes : "");     self7.new_equipment = ko.observable(data ? data.new_equipment : "");     self7.nri_state_id = ko.observable(data ? data.nri_state_id : ""); }  function tasksbycategory(data) {         var self2 = this;         self2.category_id = ko.observable(data ? data.category_id : "");         self2.category_name = ko.observable(data ? data.category_name : "");         self2.parent_category_id = ko.observable(data ? data.parent_category_id : "");         self2.subcategories = ko.observablearray(data ? ko.utils.arraymap(data.subcategories(), function (item) {             var cat = new tasksbycategory(item);             return cat;         }): "");         self2.tasks = ko.observablearray(data ? ko.utils.arraymap(data.tasks(), function (t) {             return new task(t);         }): "");         self2.pct = ko.computed(function () {                 return "hello";         });         //    var totalactual = 0;         //    var totalpossible = 0;         //    ko.utils.arrayforeach(self2.tasks(), function (task) {         //        if (task.task_state_id() != -1) {         //            totalacutal += task.task_state_id();         //            totalpossible += 3;         //        }         //    });         //    if (totalactual != 0)         //        return ("yes");         //    else         //        return "n/a";         //}, self2); }  function task(data) {     var self3 = this;     self3.task_id =  task_id;     self3.task_name = ko.observable(data.task_name);     self3.task_desc = ko.observable(data.task_desc);     self3.task_state_id = ko.observable(data.task_state_id); } function taskstates(data) {     this.taskstates = ko.observablearray(ko.utils.arraymap(data, function (item) {         return new taskstate(item.id, item.state);     })); } function taskstate(id, state) {     var self4 = this;     self4.id = ko.observable(id);     self4.state = ko.observable(state); } 

you can per understanding . try avoid normal for loops try use ko.utils functions gives flexibility .

self2.percentage = ko.computed(function () {          var totalactual = 0;         var totalpossible = 0;          ko.utils.arrayforeach(self.tasks(),function(task){         if (task.task_state_id != -1) {                 totalacutal += task.task_state_id;                 totalpossible += 3;             }          });          if (totalactual != 0) // belive trying finding % overall               return (totalactual / totalpossible);         else              return "n/a";      }, self2);