I have three tabs and I would like to populate those tabs with section contents that is already present on the page:
<section class="rbs-section" id="rbi_S_12466479" name="world1">
<p>Hello World1</p>
</section>
<section class="rbs-section" id="rbi_S_12466477" name="world2">
<p>Hello World2</p>
</section>
<section class="rbs-section" id="rbi_S_12466478" name="world3">
<p>Hello World3</p>
</section>
My TabStrip:
<div id="tabstrip">
<ul>
<li class="k-state-active">
World1
</li>
<li>
World2 </li>
<li>
Wordl3
</li>
</ul>
</div>
Javascript:
$(document).ready(function() {
$("#tabstrip").kendoTabStrip({
animation: {
open: {
effects: "fadeIn"
}
}
});
});
How can I use Kendo TabStrip code to use my custom sections in those tabs? Kindly let me know.
Cheers.
here is a dojo with a working example. Tab strip with sections.
You will notice that all I have done is wrap you sections
with a div.
the tab strip expects to see a div
within the content collection as the child element ie the content.
hopefully this answers your question. If you need any further details let me know.
UPDATE
I have updated the dojo. It is not the most elegant way of doing it but it will work without you changing your DOM to much.
UPDATE 2 updated dojo 2
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.