テクスチャボックスの値を行と列に別々に合計して表示する方法は？

Question

私がやりたいすべてで計算rowtotal columntotal個別にそれぞれの行と列のためとgrandtotal

<table class="table-bordered table-striped" id="example"> 
      @*Displays my project list headers from the database*@ 

      <thead> 
       <tr> 
        <th> 
         Name 
        </th> 
        <th> 
         Employee Id 
        </th> 
        <th>Cost Center</th> 
        @foreach (var item in Model.Projects) 
        { 
         <th>@Html.DisplayFor(p => item.ProjectName, new {@class = "projects" })</th> 
        } 
       </tr> 
       <tr> 
        <th></th> 
        <th></th> 
        <th></th> 
        @foreach (var item in Model.Projects) 
        { 
         <th>@Html.DisplayFor(p => item.Code.CodeName, new { Style = "width:5em;" })</th> 
        } 
       </tr> 
       <tr> 
        <th></th> 
        <th></th> 
        <th></th> 
        @foreach (var item in Model.Projects) 
        { 
         <th>@Html.DisplayFor(p => item.NetworkId)</th> 
        } 
        <th>Total</th> 
       </tr> 
      </thead> 
    @*Displays my employee list from the database*@ 
      <tbody> 
       @for (int i = 0; i < Model.ForecastInfoList.Count(); i++) 
       { 

        <tr> 
         <td>@Html.DisplayFor(Emp1 => Model.ForecastInfoList[i].EmpName)</td> 
         <td> 
          @Html.HiddenFor(x => Model.ForecastInfoList[i].EmpId) 
          @Html.DisplayFor(Emp1 => Model.ForecastInfoList[i].EmpSapId) 
         </td> 
         <td>@Html.DisplayFor(Emp1 => Model.ForecastInfoList[i].CostCenter)</td> 
         @for (int j = 0; j < Model.ForecastInfoList[i].ProjectHours.Count(); j++) 
         { 
          <td> 
           @Html.HiddenFor(x => Model.ForecastInfoList[i].ProjectHours[j].EmpId) 
           @Html.HiddenFor(x => Model.ForecastInfoList[i].ProjectHours[j].ProjectMasterId) 
           @Html.HiddenFor(x => Model.ForecastInfoList[i].ProjectHours[j].Month) 
           @Html.TextBoxFor(x => Model.ForecastInfoList[i].ProjectHours[j].Hours, new { @class = "Hours", Style = "text-align:left; width:5em;" }) @*displays my textboxes*@ 
          </td> 
         } 
         <td> 
          <span class="total_emp_value"> 
           @Html.DisplayFor(x => Model.ForecastInfoList[i].EmpTotal) @*displays my vertical total column*@ 
          </span> 
         </td> 

        </tr> 
       } 
      </tbody> 

      <tfoot> 
       <tr> 
        <th></th> 
        <th></th> 
        <th> 
         Total 
        </th> 
        @for (int i = 0; i < Model.ForecastInfoList[0].ProjectHours.Count(); i++) 
        { 
         <td> 
          <span class="total_proj_value"> 
           @Html.DisplayFor(x => Model.ForecastInfoList[i].ProjTotal) @*displays my horizontal total column*@ 
          </span> 
         </td> 
        } 
        <td> 
         <span class="grandtotal"> 
          @Html.DisplayFor(m => Model.ForecastInfoList[0].GrandTotal) 
         </span> 
        </td> 
       </tr> 
      </tfoot> 
     </table> 
    </div> 
    <br /> 
    <div class="button"> 
     <p><input type="submit" class="btn-sm btn-warning" value="Save" name="Save" /> </p> 
    </div> 
</div> 

スクリプトに使用

<script> 
    $(document).on("input", ".Hours", function() { 

     total = 0; 
     if ($(this).val() != "") { 
      total += parseInt($(this).val()); 

      $(this).parent().parent().find(".total_emp_value").val($(this).val()); 
     } 
     $(".total_emp_value").html(total); 
    });</script> 

私はに個々の列と個々の行の合計を表示したいですその行のすべてのテキストボックスとその行のすべてのテキストボックスには、行と列の合計が表示されます。しかし、私は、その後.total_emp_valueに、私は最近、私は別にそれをしたいが、私はjQueryのに新しいですので、私が行うことができません合計total_emp_value

に表示なっている変更のみテキストボックスを私のスクリプトを設定するときに

Answer 1

@{ 
List<string> data = new List<string>() { "one", "two", "three" }; // Your Model data 
    int i = 0; 
    int j = 0; 
} 

<div> 
    <table> 
     @foreach (var item in data) 
     { 
      i++; 
      //for() inside loop to break when the count of your object has the last index e.g. i =3 (use break;) 
      <tr> 
       <td>@Html.TextBox("name","", new { id = "txtboxRow" + i + "col" + j })</td> 
      </tr> 
     } 
    </table> 
</div> 

Answer 2

使用可能な行数/列数のループを作成してみることができます。このような何か...

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#value11").val(Number($("#textboxrow1col1").val()) + Number($("#textboxrow1col2").val())); 
    }); 
    </script> 

＃のvalue11、＃のtextboxrow1col1、＃のtextboxrow1col2 - ダイナミックでなければなりません（あなたはかみそりのビューを介して作成することができます）

ここでは、このためのplunkerではなく、完全なソリューションです。

私の行と列の両方がモデルIドンのリストから生成されているので、私は明示的に次のように...＃1 textboxrow1col1を定義することはできません

http://plnkr.co/edit/re7ROFztHZqjUlkzuBBD?p=preview