This is a migrated thread and some comments may be shown as answers.
How to add TabStrip in Layout and create dynamic tabs
3 Answers 39 Views
This is a migrated thread and some comments may be shown as answers.
Adil
Top achievements
Rank 1
Adil asked on 12 Mar 2020, 11:57 AM

Hi All

I have an idea i want to create a web page with Tabstrip and Layout page will be tabstrip , when i select new page from menu it will create new Tab and show view inside that and if its created no need to destroy and create again?

 

Is it possible to do this with Kendo TabStrip ?

Thanks

3 Answers, 1 is accepted

Sort by
0
Nencho
Telerik team
answered on 16 Mar 2020, 09:00 AM

Hello, Adil,

Yes, the described scenario is feasible with the Kendo TabStrip and Menu. The implementation could be achieved using the rich ClientAPI of the components.

Having in mind the described scenario, the following steps should apply:

  1. Handle the select even of the Menu, where you can get the currently selected item.
  2. Get a reference to the TabStrip and loop the items collection, in order to check of certain item already exists:
    https://docs.telerik.com/kendo-ui/api/javascript/ui/tabstrip/methods/items
  3. If it doesn't, you can use the append method of the TabStrip, in order to add the new tab:
    https://docs.telerik.com/kendo-ui/api/javascript/ui/tabstrip/methods/append

In addition, you may find the following forum resources helpful, where the dynamical adding and removing tabs in the TabStrip are discussed (regardless that you use Telerik UI for MVC the implementation requires client-side implementation):

https://www.telerik.com/forums/example-of-dynamically-adding-removing-tabs

https://stackoverflow.com/questions/56723400/dynamically-adding-html-files-as-tabs-to-kendo-tabstrip

Hope this information would help.

Regards,
Nencho
Progress Telerik

Get quickly onboarded and successful with your Telerik UI for ASP.NET MVC with the dedicated Virtual Classroom technical training, available to all active customers.
0
Adil
Top achievements
Rank 1
answered on 18 Mar 2020, 01:53 PM

Dear Nencho,

Thank you for your support

I can create now new tabs dynamically but i have one problem too.... 

When i create new tab and select that one i saw that new tab content also in first tab....

Here how i add tabs

tabstrip.append({
            text: "new",
            encoded: false,
            contentUrl: myurl,
        });

 

Why i can get bug like this??

0
Nencho
Telerik team
answered on 20 Mar 2020, 09:13 AM

Hello, Adil,

I am afraid that I can hardly guess the reason for the described behavior. That said, I would suggest submitting a support ticket, along with a runnable sample attached. This way, we could examine the entire implementation, revise the issue and pin down the reason for it.

Regards,
Nencho
Progress Telerik

Get quickly onboarded and successful with your Telerik UI for ASP.NET MVC with the dedicated Virtual Classroom technical training, available to all active customers.
Asked by
Adil
Top achievements
Rank 1
Answers by
Nencho
Telerik team
Adil
Top achievements
Rank 1
Share this question
or