C# 如何在MVC中呈现HighCharts的部分视图并传递参数?

C# 如何在MVC中呈现HighCharts的部分视图并传递参数?,c#,asp.net-mvc,highcharts,C#,Asp.net Mvc,Highcharts,我已经能够使用从数据库中提取的DotNet Highcharts制作条形图。根据我所读到的关于局部视图的内容,我对其进行了修改,以使用viewmodel。渲染局部视图时,我需要能够传递id。每当我尝试获取要渲染的局部视图时,我要么只得到空白,空白加上一个单独的分号,要么在将void转换为object或将anonymous转换为object时出错 这是我的控制器: public ActionResult ManaProduction(int deckid = 0) {

我已经能够使用从数据库中提取的DotNet Highcharts制作条形图。根据我所读到的关于局部视图的内容,我对其进行了修改,以使用viewmodel。渲染局部视图时,我需要能够传递id。每当我尝试获取要渲染的局部视图时,我要么只得到空白,空白加上一个单独的分号,要么在将void转换为object或将anonymous转换为object时出错

这是我的控制器:

 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)
@model Login.Models.ViewDeck
@{
ViewBag.Title=“详细信息”;
}
@DisplayFor(model=>model.Deck.Title)
甲板

卡片组中的卡片总数:@Html.DisplayFor(model=>model.CardCount)| RATING@Html.DisplayFor(model=>model.DECK.RATING)共5张
@(模型图) 生物(@(Model.CreatureCount))
@foreach(Model.biotes中的变量项) { @项目
}
旅法师(@(Model.PlaneswalkerCount))
@foreach(模型中的var项目。旅法师) { @项目
}
实例(@(Model.InstantCount))
@foreach(Model.Instants中的变量项) { @项目
}
拼写(@(Model.SpellCount))
@foreach(Model.Spells中的变量项) { @项目
}
土地(@(Model.LandCount))
@foreach(Model.Lands中的var项目) { @项目
} Description:@Html.DisplayFor(model=>model.Deck.Description) @foreach(Model.CardList中的var项){ }
Wins:@(Model.Deck.Wins)
损失:@(模型.甲板.损失)
@Html.Partial(“ManaProduction”,模型)
由于在局部视图中,视图模型类型是ViewDeck,并且与渲染局部的视图似乎是同一个模型,因此只需传入模型本身即可

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

当我这样做时,我会得到以下错误:传入字典的模型项的类型为“System.Int32”,但此字典需要“Login.Models.ViewDeck”类型的模型项。我已经添加了完整的部分视图代码。我按照建议进行了更改,现在它根本不会影响生产控制器,也不会渲染任何内容,但没有错误:(我已经为我试图将部分视图添加到的视图添加了代码。这可能是因为您的部分视图与我猜的控制器同名?它根本不会呈现您的整个视图还是只是不呈现部分视图?尝试将您的部分视图从ManaProduction重命名为ManaProductionPartial并更新您的Html。partial ca我最终将所有代码移到了基本控制器,然后做了一个部分视图:public ActionResult PartialManaProd(){return PartialView();}这不是我想要的,因为我希望将每个局部视图的代码放在它自己的控制器中。更新了我的答案,请尝试输出请查看我对我的答案的最新评论