Question

I want to show a poll result for a specific poll question.
When question list clicked i want to bind my chart with a query according to selected questionId.

So my plan was;
1. get questionId from selected question row. it’s ok.

1. defining ClientEvents.OndataBinding event on my chart. So i would be able to
   pass questionId with;

   function onChartDataBinding(e) {
   e.data = $.extend(e.data, { questionId: questionId });
   }

2. using $('#ChartPollResults').data('tChart').rebind(); on question list grid row selected event.

This scenario works when i have second grid binding according to first grids selected row.
But it seems there is no ClientEvents.OnDataBinding event on chart control.
And “rebind()” method isn’t supported on Chart control.

The chart conrol i use is below.

@(Html.Telerik().Chart<QuestionResult>()
                            .Theme("WebBlue")
                            .Name("ChartPollResults")
                            .Title("Poll Question Choice Number vs. Choice Count")
                            .Legend(legend => legend.Position(ChartLegendPosition.Bottom))
                            .Series(series =>
                            {
                                series.Bar("ChoseCount").Name("Choice Count").Gap(5);
                            })
                            .CategoryAxis(axis => axis.Categories(o => o.ChoiceNumber))

                            .DataBinding(dataBinding => dataBinding.Ajax().Select("_PollResultChartBinding", "Poll", new { questionId = 0 }))
                            .HtmlAttributes(new { style = "width: %100px; height: 270px" })
                    )

My Controller binding method;

public ActionResult _PollResultChartBinding(int questionId = 0)
{
            //questionId = 3;
            if (!ModelState.IsValid || questionId == 0)
                return Json(new List<QuestionResult>());

            PollQuestionDefinition pollQuestion = service.Get(questionId);
            List<PollAnswer> pollAnswers = service.GetPollAnswersByQuestion(questionId);
            PollQuestionResultUI result = new PollQuestionResultUI(pollQuestion, pollAnswers);

            return Json(result.Results);
}

When i comment out //questionId = 3; line i can see the results for the question wiht Id= 3 in chart with no problem.

But i can’t pass questionId to chart.

Thanks in advance.

Answer 1

First of all, one thing I immediately noticed is that you set questionId equal to 0 in your ActionResult parameters. I actually just modified a Chart I had up and running to pass in

new { questionID = 0}

as an additional parameter to my Ajax select statement and it passed in fine.

As for passing the parameter you could consider using a POST to the server on Grid selection and pass the parameter that way. I know it might not be ideal here, but you could theoretically either populate the Chart in that post, or just set a ViewData entry to contain the particular questionID that you are looking for.

I also noticed that you submitted this to the Telerik forums and from the response there it would seem that the above approach might actually work pretty well, or you could use the approach mentioned there (partial view with ajax calls).