2015-09-09 51 views
0

我已經能夠使用DotNet Highcharts從數據庫中提取條形圖。我已經修改它以基於我閱讀的關於部分視圖的內容來使用視圖模型。我需要能夠在渲染局部視圖時傳遞一個id。每當我嘗試獲取局部視圖渲染時,我只會得到空白,空白加上一個單獨的分號,或者將void轉換爲對象或將匿名轉換爲對象。如何渲染HighCharts的部分視圖並在MVC中傳遞參數?

這裏是我的控制器:

public ActionResult ManaProduction(int deckid = 0) 

     { 

      var query = string.Format("Select C.* from Cards C Left Join CardDecks CD ON CD.CardID = C.CardID Where DeckID = {0}", deckid); 
      var cardlist = db.Cards.SqlQuery(query).ToList(); 
      var red = cardlist.Where(g => g.ProducesRedMana == true).Count(); 
      var blue = cardlist.Where(g => g.ProducesBlueMana == true).Count(); 
      var green = cardlist.Where(g => g.ProducesGreenMana == true).Count(); 
      var white = cardlist.Where(g => g.ProducesWhiteMana == true).Count(); 
      var black = cardlist.Where(g => g.ProducesBlackMana == true).Count(); 
      var colorless = cardlist.Where(g => g.ProducesColorlessMana == true).Count(); 
      Highcharts chart = new Highcharts("chart") 
       .InitChart(new DotNet.Highcharts.Options.Chart { DefaultSeriesType = ChartTypes.Column }) 
       .SetTitle(new Title { Text = "Mana Production" }) 
       .SetXAxis(new XAxis { Categories = new[] { "Red", "Blue", "Green", "White", "Black", "Colorless" } }) 
       .SetYAxis(new YAxis 
       { 
        Min = 0, 
        Title = new YAxisTitle { Text = "Mana Count" } 
       }) 
       .SetLegend(new Legend 
       { 
        Layout = Layouts.Vertical, 
        Align = HorizontalAligns.Left, 
        VerticalAlign = VerticalAligns.Top, 
        X = 100, 
        Y = 70, 
        Floating = true, 
        BackgroundColor = new BackColorOrGradient(System.Drawing.ColorTranslator.FromHtml("#FFFFFF")), 
        Shadow = true 
       })    
       .SetTooltip(new Tooltip { Formatter = @"function() { return ''+ this.y +': '+ this.x +' mana'; }" }) 
       .SetPlotOptions(new PlotOptions 
       { 
        Column = new PlotOptionsColumn 
        { 
         PointPadding = 0.2, 
         BorderWidth = 0, 
         ColorByPoint = true, 
         //Colors = [ "red", 'blue', 'green', 'gray', 'black', 'gray'] 

        } 

       }) 
       .SetSeries(new[] 
       { 
        //new Series { Name = "Mana", Data = new Data(new object[] { blue, black, green, white, colorless, red }) }, 
        new Series { Name = "Mana", Data = new Data(new[] 
        { 
         new Point { Y = red, Color = System.Drawing.Color.DarkRed }, 
         new Point { Y = blue, Color = System.Drawing.Color.DeepSkyBlue }, 
         new Point { Y = green, Color = System.Drawing.Color.ForestGreen }, 
         new Point { Y = white, Color = System.Drawing.Color.Wheat }, 
         new Point { Y = black, Color = System.Drawing.Color.Black }, 
         new Point { Y = colorless, Color = System.Drawing.Color.Gray } 
        } 
        )}, 

       }); 
      var vm = new ViewDeck(); 
      vm.ManaGraph = chart; 
      return View(vm); 

這裏是我的視圖模型:

public class ViewDeck 
    { 
public DotNet.Highcharts.Highcharts ManaGraph { get; set; } 
public Deck Deck { get; set; } 
//OTHER PROPERTIES 
    public ViewDeck() 
     { } 
} 

這裏有一些事情我曾經試圖讓局部視圖來渲染:

@{Html.RenderAction("ManaProduction", "Deck", new { deckid = Model.Deck.DeckID });} 

      @{Html.RenderPartial("ManaProduction", new { deckid = Model.Deck.DeckID });} 


      @Html.Partial("ManaProduction", new {deckid = Model.Deck.DeckID}); 

任何援助將不勝感激。

編輯 - 這裏是我的局部視圖代碼:

@model Login.Models.ViewDeck 

@{ 
    ViewBag.Title = "Mana Production"; 
} 

@(Model.ManaGraph) 

這裏是我想的局部視圖添加到視圖:

@model Login.Models.ViewDeck 

@{ 
    ViewBag.Title = "Details"; 
} 

<h2> @Html.DisplayFor(model => model.Deck.Title)</h2> 

<fieldset> 
    <legend>Deck</legend> 
     <a href="@Url.Action("Edit", "Deck", new { id = Model.Deck.DeckID })" class="sublink"> <img src="@Url.Content("~/Content/themes/base/images/icons/edit.png") " style="border:none" /> Deck Details</a> 
    <a href="@Url.Action("Search", "Deck", new { deckid = Model.Deck.DeckID })" class="sublink"> <img src="@Url.Content("~/Content/themes/base/images/icons/add.png") " style="border:none" />Cards to Deck</a> 
    <a href="@Url.Action("BasicLand", "Deck", new { deckid = Model.Deck.DeckID })" class="sublink"> <img src="@Url.Content("~/Content/themes/base/images/icons/add.png") " style="border:none" />Basic Lands to Deck</a> 
    <a href="@Url.Action("Delete", "Deck", new { deckid = Model.Deck.DeckID })" class="sublink"> <img src="@Url.Content("~/Content/themes/base/images/icons/delete.png") " style="border:none" /> Deck</a><br /> 
    <div id="tabs"> 

<ul> 
    <li><a href="#tabs-1">Overview</a></li> 
    <li><a href="#tabs-2">Description</a></li> 
    <li><a href="#tabs-3">View Cards</a></li> 
    <li><a href="#tabs-4">Deck Stats</a></li> 
    <li><a href="#tabs-5">Comments</a></li> 
</ul> 

<div id="tabs-1"> 
    <hr />TOTAL CARDS IN DECK: @Html.DisplayFor(model => model.CardCount) || RATING @Html.DisplayFor(model => model.Deck.Rating) out of 5 <hr /> 
<div class="section group"> 
    <div class="col span_1_of_2"> <div id='pie_container'> 
     @(Model.Chart)</div></div> 
<div class="col span_1_of_2"> CREATURES(@(Model.CreatureCount))<br /> 
     @foreach (var item in Model.Creatures) 
     { 
      @item<br /> 
     } 
     <br />PLANESWALKERS(@(Model.PlaneswalkerCount))<br /> 
     @foreach (var item in Model.Planeswalkers) 
     { 
      @item<br /> 
     } 
      <br />INSTANTS(@(Model.InstantCount))<br /> 
     @foreach (var item in Model.Instants) 
     { 
      @item<br /> 
     } 
     <br />SPELLS(@(Model.SpellCount))<br /> 
     @foreach (var item in Model.Spells) 
     { 
      @item<br /> 
     } 
      <br />LANDS(@(Model.LandCount))<br /> 
     @foreach (var item in Model.Lands) 
     { 
      @item<br /> 
     }</div></div> 
</div> 
     <div id="tabs-2"> 
      <div class="display-field"> 
     <b>Description:</b> @Html.DisplayFor(model => model.Deck.Description) 
    </div> 
      </div> 

     <div id="tabs-3"> 
       @foreach (var item in Model.CardList) { 
      <div class="section group"> 
       <div class="col span_1_of_2"> 
        <a href="@Url.Action("Details", "Card", new { id = item.CardID })"> <img src ="@Url.Content(item.ImageUrl)" style="width:50%; border:none;" alt="image" /></a> 
       </div> 
       <div class="col span_1_of_2"> 
        <a href="@Url.Action("Delete", "CardDeck", new { cardid = item.CardID, deckid = Model.Deck.DeckID })"> <img src="@Url.Content("~/Content/themes/base/images/icons/delete.png") " style="border:none" /> 
     <br />Remove Card</a> 
       </div> 
      </div> 
       } 
     </div> 

     <div id="tabs-4"> 
      <hr /> 
     Wins: @(Model.Deck.Wins)<br /> 
     Losses: @(Model.Deck.Loss) 

     <hr /> 
<ul> 
    <li><a href="@Url.Action("ManaProduction", "Deck", new {deckid = Model.Deck.DeckID})">Mana Production</a></li> 
</ul> 
      @Html.Partial("ManaProduction", Model) 
+0

更新我的回答,請嘗試了這一點 – Jakotheshadows

+0

請看到我的最新評論我的回答 – Jakotheshadows

回答

0

由於您的視圖模型類型ViewDeck在你的局部視圖中,並且看起來與渲染局部視圖的視圖相同,你只需傳入模型本身。

//note that you don't need the semicolon here 
@Html.Partial("ManaProduction", Model) 
+0

當我這樣做,我得到這個錯誤:傳遞到字典的模型產品類型「System.Int32」的,但這個字典需要一個'Login.Models.ViewDeck'類型的模型項。我已添加完整的部分視圖代碼。 – JadeSerys

+0

我改變了建議,現在它根本沒有觸及ManaProduction控制器,並且什麼都不渲染,但沒有錯誤。 :(我已經添加了視圖的代碼,我試圖添加局部視圖到 – JadeSerys

+0

這可能是因爲你的局部視圖與你的控制器有相同的名字,我猜測它是不會渲染你的整個視圖,或者只是不是部分視圖?嘗試將你的部分視圖從ManaProduction重命名爲ManaProductionPartial並更新你的Html.Partial調用 – Jakotheshadows