[Solved] Telerik MVC Chart Parametric Binding

[Bahadir]

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.

[T. Tsonev]

Hello Bahadir,

I can confirm that the Chart does not provide DataBinding client-side event. It does have a refresh method, but it can't be used to change the select options.

We will consider adding parameter to refresh and/or databinding event in future versions. For the moment you'll have to work around this limitation, for example, by placing the Chart in a partial view and updating it with ajax.

All the best,
Tsvetomir Tsonev
the Telerik team

[Max]

hey Bahadir,
Were you able to implement Telerik's suggestion? I am facing the same issue but dont know how to code the workaround suggested.
If you have any sample code please let me know - thank you!

[Bahadir]

Hi max,

I used the chart on a Partial View and i passed my parameter on model of that partial view. It did the work for me.

Oh i just read the reply of Tsvetomir Tsonev. I did exactly what he said. I will be offline tomorrow. But if you make me remember next day i can send you some sample code.

[Daniel Blendea]

Hi Bahadir,

I have the same problem, I'd love to see how you did the binding.

[Max]

please please if you have a sample code that would be great.

Thank you so much!