We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

issue with tab calling a page


I have a issue when i call a page in a tab.
In my main page i have a grid. When i double click on a row, a dialog appears, and, in this dialog, i have tabs. Each tab call a different page.
When i'm not putting the references  of syncfusion etc in a page called by a tab, i can see the button i put here. but, when i'm putting them, my tabs disappear and i don't have any error in my browser's console.
But i have a second grid appearing, so i think it may call again my main page but i don't know why because i'm not calling it.
I putting every time the same references so they are correct.
Does anyone have any idea to help me ?


8 Replies

PK Prasanna Kumar Viswanathan Syncfusion Team May 13, 2016 10:47 AM UTC

Hi Cholet, 

Thanks for contacting Syncfusion support. 

To provide a prompt solution, we need the following details 

1)      You have mentioned that you have tabs in the dialog. So, please confirm whether you are using 
ejTab or bootstrap tab? 
2)      Have you rendered a grid or button inside the tab? 

3)      You have mentioned that each tab call a different page. So, are you loading the tab using any partial views? 

4)      Code example of the grid and tab. 
5)      Essential Studio version details. 
6)      Provide information about the issue that you are facing in your sample. 
Prasanna Kumar N.S.V 

CH Cholet May 13, 2016 02:16 PM UTC

Thank you for answering.

1/I'm using ejTab.
2/I put a button in the tab.
3/ I'm calling an entire page. I'm using the url parameter in "$("#myTab").ejTab("addItem""Mypage""Mypage");" to launch a action in my controller which load the page in the tab. 
This is the code of my main cshtml page. There are my grid, my dialog and my tab in it.
    @(Html.EJ().Grid<SyncfusionTest.Models.Test>("myGrid").Datasource(Model).ClientSideEvents(events => events.RecordDoubleClick("Show"))
    .Columns(col =>
            <div id="myTab">
                <div id="Tab1"></div>
                <div id="Tab2"></div>                
    <script type="text/javascript">    
    function Show(sender) 
        $("#myTab").ejTab({ width: "950px" });
        if ($("#myTab").ejTab("getItemsCount") < 1) {
    function openDialog() {
5/I'm using version 14.1450.0.41
6/ When i double click on a row of my grid, my dialog appears. I have two tabs in it. The first one is empty, and when i click on the second one, after 2 seconds my tabs disappear and my grid is duplicated. 

In the attached file you have my controller, my views, my model and screenshots.


Attachment: Syncfusion_69db0a92.rar

SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team May 16, 2016 10:51 AM UTC

Hi Cholet, 

We are unable to reproduce the issue at our end. We have used your code example to create sample and followed your procedure to view the duplication of Grid. The sample can be downloaded from the following location. 

We could see that you are referring the CSS and scripts in multiple view pages which may also be the reason for an issue. So we suggest to refer the scrips and _layout.cshml alone and avoid jQuery conflict in any case. 

If you are still facing any issue, please provide following information to analyze and provide you solution as early as possibile. 

1)      Please check whether your project is referring multiple Scripts and try to avoid the jQuery conflict 
2)      If possible, replicate the issue in the attached sample and send back. 

Seeni Sakthi Kumar S. 

CH Cholet May 17, 2016 09:55 AM UTC

Indeed it works with your sample. I compared it with my solution and i found that i'm using the unobtrusive javascript and not you. So I modified your sample to add the unobtrusive and then i have my issue on your sample.
It's bigger then 30Mb so i put it in a .rar in two parts so i will do another post to send you the other part.

Attachment: MvcApplication66.part01_ce565cf2.rar

CH Cholet May 17, 2016 09:56 AM UTC

Here is the second part of my .rar .

Attachment: MvcApplication66.part02_d1eedcd.rar

PK Prasanna Kumar Viswanathan Syncfusion Team May 18, 2016 12:29 PM UTC

Hi Cholet, 

Sorry for the inconvenience caused. 

In the last updated sample we have refer the script files in both index.cshtml and Mypage.cshtml file. So, we suggest you to remove the script files from the Mypage.cshtml file and use ej.widget.init() method to render the button at partial view page when in unobtrusive mode. We also suggest you to load the partial View in the tab. 

Please find the code example and sample: 


@Html.EJ().Button("button").Text("Just a button").ShowRoundedCorner(true).Size(ButtonSize.Normal) 

public ActionResult MyPage() 
            return PartialView(); 

Prasanna Kumar N.S.V 

CH Cholet May 18, 2016 03:15 PM UTC


Don't worry, you couldn't guess that i use the unobtrusive.
It works with the partial view, thank you !


PK Prasanna Kumar Viswanathan Syncfusion Team May 19, 2016 04:06 AM UTC

Hi Cholet,
We are happy that the provided solution working fine at your end.
Please let us know if you need any further assistance.
Prasanna Kumar N.S.V 

Live Chat Icon For mobile
Up arrow icon