0

I have a Telerik RadHtmlChart inside an asp Panel which uses an ajaxtoolkit CollapsiblePanelExtender.

If the panel is collapsed when I assign a datasource to the chart and databind, after the panel expands the chart only fills 1/2 the panel size, left to right. If I have the panel expanded and the chart visible during the databind, it fills the panel all the way across as expected.

Somehow I need to know when the panel has expanded and tell the chart to resize/repaint and fill the available space in the panel, but so far no joy doing this.

Or maybe there is a flag/property on my controls I've missed which would help the chart fill the available space even when the panel is collapsed.

I would prefer to work in the C# code behind, but javascript/jquery solutions are also appreciated.

Thanks,

-Rico

ricomnc
  • 1
  • 1

1 Answers1

0

HtmlChart renders on the client so you would need to use JavaScript. Here is how to resize a chart when its container resizes: http://www.telerik.com/support/code-library/radhtmlchart-in-a-responsive-web-page. Essentially - make sure its div container has the desired size and call its repaint() method.

Here is how to hook up to the client-side events of the CollapsiblePanel: http://forums.asp.net/t/1112899.aspx?How+to+track+Collapse+Expand+event+of+AJAX+Collapsible+Panel+Extender+to+call+javascript+ It is a tad tricky and you have to attach them with more client side code (add_expandComplete(theHandlerFunctionObject) and add_collapseComplete(theHandlerFunctionObject) after having the client-side object of the CollapsiblePanel).

Of course, if you trigger the expand/collapse yourself you can simply call the needed script, depending on your logic - either add it to already existing client-side handler, or registger it from the server.

rdmptn
  • 5,413
  • 1
  • 16
  • 29