2017-08-25 12 views
1

私のコードでは、ストアドプロシージャを呼び出します。結果(TaskName)の1つの列の行の値をHTMLの表の列として使用する必要があります。ノックアウト - LINQのピボットデータをHTMLテーブルに表示

私は現在、すべてのピボットデータを1つのセルに表示しています。エンティティ・フレームワークはSQL sproc内の動的SQL問合せを読み取らないため、ピボットはLINQで実行されます。

私は以下のコードセクションをそれぞれ制御して、何かを更新することができます。 ここ

SPROC出力がある

...

enter image description here

そして、これは私がHTMLの表が見てみたい方法です...

enter image description here

にはどうすれば表示されません上の希望の形式のデータ?ここで

var viewModel = function(data) { 
 
    var self = this; 
 
    
 
    // variables 
 
    self.taskRecordsTEST = ko.observableArray([ 
 
    { 
 
     "EntityCode": "DEMO", 
 
     "Tasks": [ 
 
      "Cash Process", 
 
      "Positions Process", 
 
      "Trades Process", 
 
      "Addendum Errors" 
 
     ], 
 
     "StatusFlagName": [ 
 
      "RED", 
 
      "RED", 
 
      "RED", 
 
      "ORANGE" 
 
     ] 
 
    }, 
 
    { 
 
     "EntityCode": "SP00", 
 
     "Tasks": [ 
 
      "Cash Process", 
 
      "Positions Process", 
 
      "Trades Process", 
 
      "Addendum Errors" 
 
     ], 
 
     "StatusFlagName": [ 
 
      "RED", 
 
      "ORANGE", 
 
      "RED", 
 
      "GREEN" 
 
     ] 
 
    } 
 
]); 
 
    
 
}; 
 

 
ko.applyBindings(new viewModel());
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-min.js"></script> 
 
<table class="table table-hover"> 
 
     <thead> 
 
      <tr> 
 
       <th>Entity Code</th> 
 
       <!--ko foreach: taskRecordsTEST--> 
 
       <th> 
 
        <div style="height:50px" data-bind="text: Tasks"></div> 
 
       </th> 
 
       <!--/ko--> 
 
      </tr> 
 
     </thead> 
 
     <tbody id="sortable" data-bind="foreach: taskRecordsTEST"> 
 
      <tr class="ui-state-default ui-state-disabled"> 
 
        <td class="ui-state-default" data-bind="text: EntityCode"></td> 
 
        <td class="ui-state-default" data-bind="text: StatusFlagName"></td> 
 
       </tr> 
 
     </tbody> 
 
    </table>

http://jsfiddle.net/v2L1ny8r/9/

+0

質問は何ですか? –

+0

申し訳ありません。更新しました。 – Kevin

+0

それはあまりにも広いです。少なくとも、あなた自身がこれを達成するための真剣な試みを1つ表示する必要があります。そして、どこが失敗したのか、どこに止まっているのかを正確に示してください。 –

答えて

1
...

以下
var records = from tr in _dbContext.Task_GetParentRecords().AsEnumerable() 
          group tr by tr.EntityCode 
          into grp 
          select new TaskRecordOverviewDTO() 
          { 
           EntityCode = grp.Key, 
           Tasks = grp.Select(t => t.TaskName), 
           StatusFlagName = grp.Select(t => t.OverallStatus) 
          }; 

が私のHTML、JavaScript、およびノックアウトコードです... LINQクエリです

だと思いますforeachと一緒にバインドしています。

http://jsfiddle.net/v2L1ny8r/13/

<table class="table table-hover"> 
    <thead> 
    <tr> 
     <th>Entity Code</th> 
    <!--ko with: taskRecordsTest()[0]--> 
     <!-- ko foreach: $data.Tasks --> 
     <th data-bind="text: $data"></th> 
     <!--/ko--> 
     <!--/ko--> 
    </tr> 
    </thead> 
    <tbody id="sortable" data-bind="foreach: taskRecordsTest"> 
    <tr> 
     <td data-bind="text: EntityCode"></td> 
     <!-- ko foreach: $data.StatusFlagName --> 
      <td data-bind="text: $data"></td> 
     <!--/ko--> 
    </tr> 
    </tbody> 
</table> 
関連する問題