2017-03-14 8 views
-1

私は、.NET Controllerの特定のタイムゾーンを取得するアクションに次のコードを記述しました。そのIグループの後、次のようにそのタイムゾーンに基づいたデータによって:ポストした後のjQueryの再描画モリスグラフ.NET MVC

[HttpPost] 
     [ActionName("FetchTimeZone")] 
     public ActionResult FetchTimeZone(string timeZone) 
     { 
      using (var ctx = new myContext()) 
      { 
       var loggedUser = ctx.Users.FirstOrDefault(x => x.Email == User.Identity.Name); 
       var userStores = ctx.UserStores.Where(x => x.UserId == loggedUser.UserId).SelectMany(x => x.StoreItems.SelectMany(y => y.StoreItemTransactions)).ToList(); 
       var hourlyData = userStores 
       .GroupBy(x => TimeZoneInfo.ConvertTime(x.TransactionDate.Value, TimeZoneInfo.FindSystemTimeZoneById("Tokyo Standard Time")).Hour) 
       .Select(pr => new HourlyGraph { Hour = pr.Key, Sales = pr.Sum(x => x.QuantitySoldTransaction) }) 
       .ToList(); 
       hourlyData.AddRange(Enumerable.Range(0, 24) 
       .Except(hourlyData.Select(m => m.Hour)) 
       .Select(i => new HourlyGraph() { Hour = i, Sales = 0 })); 
       ViewBag.HourlyGraph = hourlyData.OrderBy(x => x.Hour).ToList(); 
       return Json("OK"); 

      } 
     } 

をすべてここには良いですが、私たちは、ページがロードされたときに最初は私が埋める.. jQueryとデータ表現と表示部分に移動しますCESTタイムゾーンのグラフであり、データを正しく表しています。そこで、クリックしたイベントを作って、送信されたタイムゾーンに基づいてモリスグラフを再描画する必要があります。

デフォルトでは、これが機能するかどうかを検証するために、東京標準時をコードに設定しています。だから、最初は私はこのようなグラフを埋める:

hourlyGraph.redraw(); 
    $(window).trigger('resize'); 

私がする必要がある:これは著作ない部分がある

$('.convertTimeZone').click(function(event){ 
     event.preventDefault(); 
     $.post("/GeoTargeting/FetchTimeZone",{timeZone: "timeZone"}).done(function(data){ 

      hourlyGraph.redraw(); 
      $(window).trigger('resize'); 
     }); 
    }); 

var hourlyGraph = Morris.Bar({ 
      element: 'graph_bar', 
      data: [ 
       @foreach (var item in ViewBag.HourlyGraph) 
       { 
       @:{device: '@item.Hour.ToString("D2"):00', geekbench:@item.Sales }, 
       } 
      ], 
      xkey: 'device', 
      ykeys: ['geekbench'], 
      labels: ['Sold'], 
      barRatio: 0.4, 
      barColors: ['#0A4D70', '#34495E', '#ACADAC', '#3498DB'], 
      xLabelAngle: 35, 
      hideHover: 'auto', 
      resize: true 
     }); 

のonclickイベントは次のようになりますどういうわけか、投稿が終わってグラフを再描画して、それを私のビューに表示します...しかし、私はここで何が間違っているのか分かりません...誰かが私を助けてくれるのですか?

+0

誰か? =)おそらく私はJsonの代わりに景色を返すべきでしょうか? – User987

答えて

1

あなたのメソッドはjsonを返しています(応答の唯一のものは"OK"です - チャートを更新するために使用できるデータはありません)。ビューを返さないかぎり(ビューがそれらの値を使用している場合を除く)、ポイント設定ViewBagはありません。

あなたの方法のいずれか

  1. 戻り に基づいて、新しいグラフのHTMLを含む部分図はhourlyDataのとあなたの $.post()機能のsuccess callbaclの値、置き換えることにより、DOMを更新する必要があり、既存のたとえば var data = hourlyData.Select(x => new { device = x.Hour.ToString(...), geekbench = x.Sales }); return Json(data);ためのグラフ、グラフを更新するためのデータを含む か
  2. 戻りJSONは、そう successコールバックで、あなたはUPDATできることグラフのデータ(例: hourlyGraph.setData(data);を使用)
関連する問題