Rendering Chart in 2nd Tab

Thread ID:	Created:	Updated:	Platform:	Replies:
142383	Jan 31,2019 02:07 AM UTC	Feb 1,2019 04:51 AM UTC	ASP.NET MVC - EJ 2	3

Subscribe to this post

Tags: Tab

Kenneth Tang

Asked On January 31, 2019 02:07 AM UTC

Dear all,

When we put a chart in non-seleted tab within tab control, we found that the chart can't resize when user active that tab.

Please advance how we could solve the issue, thx.

KennethT

Attachment: Archive_dd4fabc8.zip

Reply | Reply with quote

Deepa Loganathan [Syncfusion]

Replied On January 31, 2019 07:27 AM UTC

Hi Kenneth,

We understood your concerns regarding Tab control. This issue can be resolved using one of the below options.

1. If you are using ContentTemplate option to add Tab content

The reported issue is a known issue in the reported version and has been fixed in patch release version (16.4.47). With this fix, the tab content rendered with ContentTemplate will fit inside the Tab item.

So please use the updated Nuget package to the latest version to resolve the issue that can be downloaded from the following link.

https://www.nuget.org/packages/Syncfusion.EJ2.MVC5/

Please check our below help link to render Tab using Content template and get back to us if you have any further queries.

https://ej2.syncfusion.com/aspnetmvc/documentation/tab/how-to/render-the-tab-using-content-template

2. Other than ContentTemplate

If you are not using ContentTemplate , you need to refresh the Chart instance in the selected event of Tab as given in the below code.

@Html.EJS().Tab("ej2Tab").Items(@Viewbag.items).Selected("tabSelected").Render()

function tabSelected(e) {

if(e.selectedIndex === 2){ // check the selected Index

setTimeout(() => {

var chartEle = document.querySelector('.e-tab .e-content #e-content_' + ((e === undefined || e === null) ? 0 : e.selectedIndex) + ' .e-chart');

var chartObj = chartEle.ej2_instances[0];

chartObj.refresh(); // refreshed chart object on tab selection

}, 400);

}

</script>

With this, the Chart will be refreshed to fit in the Tab content.

Kindly let us know if you have any further concerns. We will be happy to assist you.

Regards,

Deepa L.

Reply | Reply with quote

Kenneth Tang

Replied On January 31, 2019 02:10 PM UTC

Dear Deepa,

Thank a lot!

KennethT

Reply | Reply with quote

Deepa Loganathan [Syncfusion]

Replied On February 1, 2019 04:51 AM UTC

Hi Kenneth,

You are most welcome.

Please get back to us if you have any further queries.

Regards,

Deepa L.

Reply | Reply with quote

Rendering Chart in 2nd Tab

Thread ID:

Created:

Updated:

Platform:

Replies:

Please sign in to access our forum

CONTACT US