Create Tabs Dynamically Based on Values Selected in Listbox in ASP.Net

See more:

ASP.NET

Javascript

jQuery

Hi, does anyone know how can I create tabs dynamically based on what is selected from a Listbox?

This is what I have:

Listbox:

 <asp:ListBox ID="SelectionListBox" runat="server" AppendDataBoundItems="True" SelectionMode="Multiple" Height="130px" Width="350px">
    <asp:ListItem Text="Apple" Value ="1"  />
    <asp:ListItem Text="Watermelon" Value ="2"  />
    <asp:ListItem Text="Kiwi" Value ="3"  />
    <asp:ListItem Text="Plum" Value ="4"  />
    <asp:ListItem Text="Pineapple" Value ="5"  />
</asp:ListBox>

RetrieveButton:

<asp:Button ID="RetrieveButton" runat="server" Text="Button" />

Based on what the user has selected from the Listbox, when the user pressed on the Retrieve button, number of tabs will be created based on the number of values user has selected from Listbox.

For example:
Let's say user has selected 3 items from the Listbox and click on the button, 3 tabs should be created at the bottom of the page on the same page with the tab names as the listbox items texts.

Sample Output Illustration:
---------------------------------------------------------------

|ListBox|

|RetrieveButton|

---------------------------------------------------------------

Tabs:
Apple | Watermelon | Kiwi

---------------------------------------------------------------

Any help is greatly appreciated. Thanks!