Question

I have an intranet web project that is currently using the IEWC tabstrip and multipage controls.

Since these are very out of date, and cause lots of issues when trying to support multiple browsers, I am trying to find a good way to replace these controls, preferably without and drastic changes to the site’s design or usability.

One method I am considering is using jquery UI tabs, which looks like it might work in a similar fashion.

How can I replace these outdated controls?

Current snippet:

<iewc:tabstrip id="ts1" style="position:relative; float:left;" runat="server" TargetID="mpVert">
    <iewc:Tab HoverImageUrl="images/selected_tab1.gif" SelectedImageUrl="images/selected_tab1.gif"
            DefaultImageUrl="images/unselected_tab1.gif"></iewc:Tab>
    <iewc:Tab HoverImageUrl="images/selected_tab2.gif" SelectedImageUrl="images/selected_tab2.gif"
            DefaultImageUrl="images/unselected_tab2.gif"></iewc:Tab>
</iewc:tabstrip>
<iewc:multipage id="mpVert" runat="server" BorderWidth="1px" BorderStyle="Outset"
    style="position:relative; float:left; width:99.9%; min-height:200px;">
    <iewc:PageView>
        <SampleControl:MyControl runat="server" id="sampleControl" name="JustAnExample" />
    </iewc:PageView>
    <iewc:PageView>
        <div>More stuff in here for tab 2</div>
    </iewc:PageView>
</iewc:multipage>

One of the issues I am running into is that the site was originally designed with the expectation that the controls on every tab would be included in the page for every request. This could be changed, but as this is a side project, I’m hoping to find a way to work around this.

Answer 1

I would definitely go with jQuery UI Tabs. I’ve used custom solutions as well as the Ajax Control Toolkit Tabcontainer and my clients have often come up with requirements that was way easier to solve with jQuery UI Tabs. It’s just more flexible and at the same time gives you a lot of functionality out of the box.

See simple demo here: http://jsfiddle.net/jimmysv/GTZvR/