Как загрузить отдельное содержимое окна kendo в html при нажатии кнопки

Question

Я пытаюсь загрузить ленту kendo из отдельного html в окно кендо одним нажатием кнопки. Я смог получить кнопку при нажатии, загрузив содержимое из отдельного файла в окно, но вместо того, чтобы получать вкладки, как я предполагаю, у меня есть все содержимое загружено. Единственный способ заставить вкладки работать, если у меня есть весь код в одном index.html, но мне нужно их разделить. Это проблема уже несколько дней, и я не могу найти решение. Пожалуйста помоги.

Внутри моей index.html, у меня есть:

<button class="submit-button" data-toggle="modal" data-target="modal" id="open-button" type="submit">Create New</button> 

<div id="window"></div> 

и вот мой modal.html:

<div class="tab k-content" id="tabstrip-left"> 
    <ul> 
    <li class="k-state-active">General Details</li> 
    <li>Coverage Details</li> 
    <li>Header &amp; Video</li> 
    <li>CTA Buttons</li> 
    <li>Savings Grid</li> 
    <li>Footer</li> 
    </ul> 
    <div class="container-fluid">General Content</div> 
    <div class="container-fluid">Coverage Content</div> 
    <div class="container-fluid">Header & Video Content</div> 
    <div class="container-fluid">CTA Content</div> 
    <div class="container-fluid">Savings Content</div> 
    <div class="container-fluid">Footer Content</div> 
    <fieldset class="form-group"> 
    <ul class="pager wizard"> 
     <li class="save button">Save</li> 
     <li><button class="close-button">Close</button></li> 
     <li class="back button">Back</li> 
     <li class="next button">Next</li> 
     <li class="finish button">Finish</li> 
    </ul> 
    </fieldset> 
</div> 

и мои script.js

$(document).ready(function() { 

$("#window").load("create.html"); 

//populate grid with internal data 
var grid = $("#grid").kendoGrid({ 
      scrollable: true, 
      dataSource: clients 
     }); 

//variables 
var myWindow = $("#window"), 
    openButton = $("#open-button"), 
    tabstripLeft = $("#tabstrip-left"); 
    closeButton = $(".close-button"); 

//'create new' opens up modal 
openButton.click(function() { 
    myWindow.data("kendoWindow") 
    .center() 
    .open(); 
}); 

//modal window settings 
myWindow.kendoWindow({ 
    width: "900", 
    title: "Website Content", 
    visible: false, 
    modal: true, 
    actions: ["Close"], 
}).data("kendoWindow"); 

//remove keyboard navigation 
myWindow.removeAttr("tabindex"); 

//modal tabs 
tabstripLeft.kendoTabStrip({ 
    tabPosition: "left", 
    animation: false, 
    navigatable: true 
}); 

//close modal button inside window 
closeButton.click(function() { 
    myWindow.data("kendoWindow").close(); 
    }); 
}); 

Answer 1

При попытке для запуска виджета, tabstrip html пока не отображается. Попробуйте запустить виджет tabstrip в html create.html.