Как отобразить мою диаграмму в виде с помощью помощников mvc?

Question

Я использую помощники MVC для создания гистограммы на основе суммы часов, которые сотрудник работал против месяцев. Я использую выпадающий список, чтобы отфильтровать эти диаграммы по имени сотрудника. Но у меня проблема, когда я нажимаю на выпадающий список, отображается правильный график, но только изображение, а не в виде страницы. Как это исправить? Пожалуйста помоги. Мой метод в контроллере.

   public ActionResult CharterColumn(string Status)

                {
                    var results = (from c in db.Clockcards select c);




                var groupedByMonth = results
                    .Where(a => a.Name == Status)
                    .OrderByDescending(x => x.Date)
                    .GroupBy(x => new {x.Date.Year, x.Date.Month}).ToList();



                List<string> monthNames = groupedByMonth

                    .Select(a => a.FirstOrDefault().Date.ToString("MMMM"))
                    .ToList();

                List<double> hoursPerMonth = groupedByMonth
                    .Select(a => a.Sum(p => p.Hours))
                    .ToList();


                ArrayList xValue = new ArrayList(monthNames);
                ArrayList yValue = new ArrayList(hoursPerMonth);

                new Chart(width: 800, height: 400, theme: ChartTheme.Blue)
                    .AddTitle("Chart")
                    .AddSeries("Default", chartType: "Column", xValue: xValue, yValues: yValue)
                    .Write("bmp");

                return null;
            }



            public ActionResult Index()
            {

                ViewBag.Status = (from r in db.Clockcards
                    select r.Name).Distinct();


                return View();
            }

Мой взгляд

    <p>
        @using (Html.BeginForm("CharterColumn", "Chart", FormMethod.Get))
        {
            <b>Search by Full Name:</b><font color="black">@Html.DropDownList("Status", new SelectList(ViewBag.Status), new { onchange = "this.form.submit()" })</font>


        }
    </p>

Answer 1

Извините за комментарии, мне было немного неясно, в чем именно заключалась проблема. Но я думаю, что это то, что вы хотите. Для контроллера

public ActionResult Index() 
        {
            ViewBag.Status = new[] { "A", "B" };

            return View();
        }
//This controller returns an jpeg image you can use bmp but I think this will be better.
        public ActionResult Chart(string status) 
        {
            WebImage image;
            switch (status)
            {
                case "A":
                    image = new Chart(width: 800, height: 400, theme: ChartTheme.Blue)
                    .AddTitle("Chart")
                    .AddSeries("Default", chartType: "Column", xValue: new[] { "A" }, yValues: new[] { 10 })
                    .ToWebImage("jpeg");
                    break;
                default:
                    image = new Chart(width: 800, height: 400, theme: ChartTheme.Blue)
                    .AddTitle("Chart")
                    .AddSeries("Default", chartType: "Column", xValue: new[] { "B" }, yValues: new[] { 20 })
                    .ToWebImage("jpeg");
                    break;
            }

            return File(image.GetBytes(), "image/jpeg");

        }

И мнение

<b>Search by Full Name:</b>
<font color="black">
    @Html.DropDownList("Status", new SelectList(ViewBag.Status), new { id="dropdown", onchange = "updateChart()" })
</font>
<img id="chart" src="Chart?status=@ViewBag.Status[0]" />
<script>
    function updateChart()
    {
        var list = document.getElementById('dropdown');
        var value = list.options[list.selectedIndex].value;
        document.getElementById('chart').setAttribute('src', 'Chart?status=' + value);
    }
</script>

Вы должны предоставить источник тега img в html. Если вы хотите обновить изображение, не совершая поездки в оба конца на сервер, вам нужно будет использовать некоторый JavaScript. но это действительно просто, он просто получает значение из выпадающего списка и отправляет его на сервер. Src - это просто путь к контроллеру, который вы можете использовать, когда хотите. Просто помните, что вы не можете использовать теговые помощники в javascript, так как они отображаются на сервере.