Tab content showing in other tabs when dynamically added

2 posts, 0 answers
  1. Andrew
    Andrew avatar
    3 posts
    Member since:
    Feb 2016

    Posted 07 Jul Link to this post

    Good Afternoon,

    Not sure why this is happening but hope somebody can help.

    I need to add tabs dynamically which works ok but once they are added I can see it's content in the tabs that already existed. It's definitely the new tab's content as when I change the options in one tab, the changes are reflected in the other tabs. My code is below and I have attached some screenshots also. I would be really grateful for any assistance.

    <button type="button" class="btn btn-success" id="myButton">Add New Job</button>

                  .Items(tabstrip =>
                      tabstrip.Add().Text("1: BAIC13 ")
                          .LoadContentFrom(Url.Action("Job1", "Test"));
                          .LoadContentFrom(Url.Action("Operators", "Test"));

        $(document).ready(function () {
            $("#myButton").click(function () {
                var tabStrip = $("#tabstrip").kendoTabStrip().data("kendoTabStrip");
                var lastIndex = tabStrip.tabGroup.children("li:last").index();
                            text: "New Tab",
                            contentUrl: '@Url.Action("AddJob", "Test")'          




  2. Dimitar
    Dimitar avatar
    276 posts

    Posted 11 Jul Link to this post


    I would suggest you to take a look at the TabStrip API demo, which shows how you could add tabs at different locations. On examining the code provided and the screenshots, my suggestion is that you might pass a wrong index when adding the content and thus your new tab has index 1, but the content is given the index of the next tab and that is why it appears in it.

    Telerik by Progress
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for ASP.NET AJAX banner
Back to Top