locked
how to pass parameter to googlechart controller. RRS feed

  • Question

  • User-786736087 posted

    I have learning asp.net and doing some vote system . when i try to display the data in google chart i find out i have problem to pass the parameter over.

    The view code is 

    <script>
    $(document).ready(function () {
    $.ajax({
    type: "POST",
    dataType: "json",
    contentType: "application/json",
    url: '@Url.Action("resultpost", "Home")',
    success: function (result) {
    google.charts.load('current', {
    'packages': ['corechart']
    });
    google.charts.setOnLoadCallback(function () {
    drawChart(result);
    });
    }
    });
    });

    function drawChart(result) {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Name');
    data.addColumn('number', 'Vote');
    var dataArray = [];


    $.each(result, function (i, obj) {
    dataArray.push([obj.ChoiceText, obj.VoteCount]);
    });
    data.addRows(dataArray);

    var columnChartOptions = {

    width: 1000,
    height: 400,
    bar: { groupWidth: "20%" },
    };

    var columnChart = new google.visualization.ColumnChart(document
    .getElementById('columnchart_div'));

    columnChart.draw(data, columnChartOptions);
    }
    </script>

    The controller is :

    public ActionResult PieChart()
    {
    return View();
    }
    public ActionResult resultpost(int? questionId)
    {
    return Json(Result(questionId), JsonRequestBehavior.AllowGet);
    }
    public static List<Choices> Result(int? questionId)
    {
    using (var context = new DBQUIZEntities())
    {
    context.Configuration.LazyLoadingEnabled = false;
    List<Choices> stdResult = context.Choices.Where(x => x.QuestionID == 1).ToList();
    return stdResult;
    }
    }

    currently i set this question ID==1 , but i want pass in parameter to replace 1 how i gonna do that? 

    i did try using something like  <a class="btn btn-info btn-sm" href="@Url.Action("Index", "Home", new { id=question.QuestionID})">View Result</a>

    but it return me a data instead of a view of chart , same for it if i return view(data);

    Friday, July 31, 2020 4:53 PM

All replies

  • User-939850651 posted

    Hi chenweijonas,

    I found that you are using ajax to get chart data. Have you tried to use ajax to pass parameters to the controller?

    Something like this:

    $.ajax({
                type: "POST",
                dataType: "json",
                data: {
                    questionId: 1
                },
                contentType: "application/json",
                url: '@Url.Action("resultpost", "Home")',
                success: function (result) {
                    google.charts.load('current', {
                        'packages': ['corechart']
                    });
                    google.charts.setOnLoadCallback(function () {
                        drawChart(result);
                    });
                }
            });
    [HttpPost]
            [ActionName("getChart")]
            public JsonResult getChartFromController(int questionId)
            {
                string resStr = string.Empty;
                if (questionId == 1) resStr = "questiond is -->" + questionId;
                else resStr = "questiond is not 1";
                return this.Json(resStr);
            }

    Hope this can help you.

    Best regards,

    Xudong Peng

    Monday, August 3, 2020 10:02 AM