2012-03-14 5 views
0

knockoutscriptsを使用してすべての行要素を更新しています。 以下のコードで何が間違っているか知っていますか?行合計を指定していません。どんな助けも役に立つでしょう。現時点では、問題は私が行頭とgrandTotalを見ることができないということです。KnockoutScriptの行の合計

<script src="../../Scripts/knockout-2.0.0.js" type="text/javascript"></script> <script language="javascript" type="text/javascript"> 
     $(document).ready(function() { 
      var rowLine = function() { 
       var self = this; 
       self.Day1Hrs = ko.observable(); 
       self.Day2Hrs = ko.observable(); 
       self.totalrow = ko.computed(function() { 
        return self.totalrow ? parseInt(self.Day1Hrs + self.Day2Hrs) : 0; 
       }); 
      }; 
      self.addLine = function() { self.lines.push(new rowLine()); }; 
      self.removeLine = function (line) { self.lines.remove(line); }; 


      var row = function() { 
       var self = this; 
       self.lines = ko.observableArray([new rowLine()]); 
       self.grandTotal = ko.computed(function() { 
        var total = 0; 
        $.each(self.lines(), function() { 
         total += this.totalrow(); 
        }); 
        return total; 
       }); 

      }; 

      ko.applyBindings(row()); 


     }); 
     </script> 
     <table> 
     <thead><tr> 
       <th class="Day1Hrs">Day1</th> 
       <th class="Day2Hrs" >Day2</th> 
       <th class="totalrow">Row Total</th> 
       <th>Delete</th> 
      </tr> 
     </thead> 
     <tbody data-bind='foreach: lines'> 

-  <tr> 
       <td> 
        <input class="Day1Hrs" data-bind='value:Day1Hrs,  valueUpdate:"afterkeydown"'/> 
       </td> 
       <td> 
        <input class="Day2Hrs" data-bind='value:Day2Hrs, valueUpdate:"afterkeydown"'/> 
       </td> 
       <td class="totalrow"> 
        <span data-bind:'text: totalrow'></span> 
       </td> 
       <td> 
        <button data-bind='click: removeLine'>Remove Line</button> 
       </td> 
      </tr> 


     </tbody> 
     <tfoot></tfoot> 
     </table>  <p class="grandTotal">Total <span data-bind='text:grandTotal'/></p>  <button data-bind='click:addLine'>Add Line</button> 

答えて

0

A jsFiddleは有用であろうが、ちょうど次のコードをスキャンすることは問題である可能性があり:

  self.Day1Hrs = ko.observable(); 
      self.Day2Hrs = ko.observable(); 

      self.totalrow = ko.computed(function() { 
       return self.totalrow ? parseInt(self.Day1Hrs + self.Day2Hrs) : 0; 
      }); 

あなたの観測はNULLとして初期化され、あなたは正しくの値を取得していません。

代わりに、試してみてください。

  self.Day1Hrs = ko.observable(0); 
      self.Day2Hrs = ko.observable(0); 

      self.totalrow = ko.computed(function() { 
       return self.Day1Hrs() + self.Day2Hrs(); 
      });