如何在C#MVC中显示jsonResult的输出?

问题描述 投票:0回答:1
I want to display a jsonResult output using my cshtml page. Below is the code i have written:

HomeController.cs code:

     public JsonResult GetScafCapacity()
            {

                var data = cap.Scaff();

                return Json(data, JsonRequestBehavior.AllowGet);

            }

            public JsonResult GetScafVolume()
            {

                var data = vol.ScaffVol();

                return Json(data, JsonRequestBehavior.AllowGet);

            }

Code in Common Folder(HomeContent.cs):

      public List<ResourceContention> Scaff()
            {

                string cString = ConfigurationManager.ConnectionStrings["homeData"].ToString();

                List<ResourceContention> scaffCapacity = new List<ResourceContention>();        
                OracleConnection conn = new OracleConnection(cString);
                OracleCommand cmd1 = new OracleCommand();
                cmd1.CommandText = "select sum(VENDOR_CAPACITY) from T_VENDOR_CAPACITY where SERVICE_DEPT ='M' and VENDOR_NAME !='DPS'";            
                cmd1.Connection = conn;
                OracleDataAdapter da = new OracleDataAdapter(cmd1);
                DataTable dt = new DataTable();
                da.Fill(dt);
                conn.Dispose();
                return (scaffCapacity);
            }
            public List<ResourceContention> ScaffVol()
            {

                string cString = ConfigurationManager.ConnectionStrings["homeData"].ToString();

                List<ResourceContention> scaffVolume = new List<ResourceContention>();
                OracleConnection conn = new OracleConnection(cString);
                OracleCommand cmd2 = new OracleCommand();
                cmd2.CommandText = "Select 0.025*(sum (VOLUME)) from T_BOOK_RESOURCE where SERVICE_DEPT ='M' and REQ_STATUS!='DISM'";
                cmd2.Connection = conn;
                OracleDataAdapter da = new OracleDataAdapter(cmd2);
                DataTable dt = new DataTable();
                da.Fill(dt);
                conn.Dispose();
                return (scaffVolume);
            }

下面是我的CSTML代码。我需要将scaffVolume值放在堆栈图中。当前只有一个条形图可以显示脚手架数量。在脚手架数量以上,我的scaffVolume值应堆叠。 ScaffCapacity将是该堆栈条上方的一个点。如果堆栈将越过该点,则越过的部分将变为RED [![enter image description here] [1]] [1]:

   /*Global Variables*/
    var graphS;
    var graphM;
    var graphSW;
    var graphMW;
    var samS;
    var samM;
    var flagResDDLS;
    var eventS;
    var arrayS;
    var flagResDDLM;
    var eventM;
    var arrayM;
    var r;
    /*GV End*/

    $(document).on("click", "#tblWeekly tr", function (e) {
        var startdate = $(this).find('td:eq(1)').text();
        var endate = $(this).find('td:eq(2)').text();
        $("#tblWeekly").DataTable({
            scrollY: '50vh',
            //scrollCollapse: true,
            paging: false,
            scrollX: true,
            fixedHeader: true,
        });
        $("#divDaily").hide();
        $("#load2").show();
        $("#tblCrane").DataTable().destroy();
        $("#tblScaf").DataTable().destroy();
        $("#tblManp").DataTable().destroy();

        $.post({
            url: '@(Url.Action("Daily", "ResourceContention"))?startdate=' + startdate + '&enddate=' + endate,
        }).promise().done(function (data) {
            $("#divDaily").html('');
            $("#divDaily").html(data);
            }).promise().done(function () {
                if ('@ViewBag.crane' ==1) {
                   $('#craneLink').css("background-color", "#ffd27f");
                }
                 if ('@ViewBag.scaf' ==1) {
                     $('#scaffLink').css("background-color", "#ffd27f");
                }
                 if ('@ViewBag.manp' ==1) {
                     $('#manLink').css("background-color", "#ffd27f");
                }
            $("#divDaily").show();

            window.setTimeout(function () {
                $.post({
                    url: '@(Url.Action("ScaffChart", "ResourceContention"))?strtdate=' + startdate + '&enddate=' + endate,
                }).promise().done(function (dataS) {
                    if (graphS)
                        graphS.destroy();
                    var dt = [];
                    var labels = [];

                    $(dataS).each(function (index, item) {
                        dt.push(item.quantity);
                        labels.push(item.WeekStartDate);
                    });

                    samS = labels;

                    //Chart Plottiong

                    var ctx = $("#myChartScaff").get(0).getContext("2d");
                    var chartS = new Chart(ctx, {
                        title: 'Scaffolding Quantity Daywise',
                        type: 'bar',
                        data: {
                            labels: labels,
                            datasets: [{
                                label: 'Scaffolding Quantity (Tons)',
                                data: dt,
                                backgroundColor: ['rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)'],
                                borderColor: ['rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)', 'rgba(21, 146, 119, 0.87)'],
                                strokeColor: "#79D1CF",
                                borderWidth: 1
                            }]
                        },
                        options: {
                            tooltips: {
                                enabled: true,
                            },
                           onClick: graphClickEventS,
                            responsive: true,
                            maintainAspectRatio: false,

                            scales: {
                                yAxes: [{                                   
                                    gridLines: {
                                        display: true,
                                    },
                                    display: true,
                                    scaleLabel: {
                                        display: true,
                                        fontColor: 'rgb(23,162,184)',
                                        labelString: 'Ton(s)'
                                    },
                                    ticks: {
                                        beginAtZero: true,
                                        //max: 3000,
                                        //stepSize : 5,
                                        mirror: true,
                                        fontColor: 'rgb(23,162,184)',
                                    }
                                }],
                                xAxes: [{
                                    gridLines: {
                                        display: false,
                                    },
                                    display: true,
                                    scaleLabel: {
                                        display: true,
                                        fontColor: 'rgb(23,162,184)',
                                        //labelString: 'FY ',
                                    },
                                    ticks: {
                                        fontColor: 'rgb(23,162,184)',
                                    }
                                }],
                            },
                            animation: {
                                duration: 0,
                                onComplete: function () {
                                    var chartInstance = this.chart,
                                        ctx = chartInstance.ctx;
                                    ctx.textAlign = 'center';
                                    ctx.fillStyle = "rgb(23,162,184)";
                                    ctx.textBaseline = 'bottom';
                                    ctx.fontStyle= "bold";

                                    this.data.datasets.forEach(function (dataset, i) {
                                        var meta = chartInstance.controller.getDatasetMeta(i);
                                        meta.data.forEach(function (bar, index) {
                                            var data = dataset.data[index]+" (Tons)";
                                            ctx.fillText(data, bar._model.x, bar._model.y - 5);

                                        });
                                    });
                                }
                            }

                        }//
                    });
                    graphS = chartS;
                }).promise().done(function () {
                    $("#load2").fadeOut("slow", function () { });
                });
            }, 1000);

        });
    });


  [1]: https://i.stack.imgur.com/MvFLZ.jpg
c# .net model-view-controller razor
1个回答
0
投票

使用新关键字呈现json结果。

public JsonResult GetScafVolume()
{
    var data = vol.ScaffVol();
    return Json(new {data}, JsonRequestBehavior.AllowGet);
}
© www.soinside.com 2019 - 2024. All rights reserved.