in my app, tabs will be visible when I click newtab item. for first tab is already visible when page loads. second tab content is visible when the there is no third tab. when third tab comes, content of second tab is not visible. below is my C# code:

public void TabStrip1_ItemClick(object sender, EO.Web.NavigationItemEventArgs e)
{

int i = TabStrip1.Items.Count;

TabItem tabItem = new TabItem();
tabItem.Text.Html = "TabItem" + (TabStrip1.Items.Count);
tabItem.Visible = false;
TabStrip1.TopGroup.Items.Add(tabItem);


System.Web.UI.Control tabPageContent = null;

tabPageContent = LoadControl("WebUserControl1.ascx");


if (i == 7)
{
TabStrip1.Items[1].Visible = true;
PageView2.Controls.Add(tabPageContent);

}
else if (i == 8)
{
TabStrip1.Items[2].Visible = true;

PageView3.Controls.Add(tabPageContent);

}
else if (i == 9)
{
TabStrip1.Items[3].Visible = true;
PageView4.Controls.Add(tabPageContent);

}
else if (i == 10)
{
TabStrip1.Items[4].Visible = true;
PageView5.Controls.Add(tabPageContent);

}
else if (i == 11)
{
TabStrip1.Items[5].Visible = true;
PageView6.Controls.Add(tabPageContent);

}

below is my aspx page:

<eo:TabStrip runat="server" id="TabStrip1" ControlSkinID="Simple_Gray" Width="1000px" MultiPageID="MultiPage1"
OnItemClick="TabStrip1_ItemClick">
<TopGroup>
<Items>
<eo:TabItem Text-Html="GRID 1"></eo:TabItem>
<eo:TabItem Text-Html="GRID 2" Visible="false"></eo:TabItem>
<eo:TabItem Text-Html="GRID 3" Visible="false"></eo:TabItem>
<eo:TabItem Text-Html="GRID 4" Visible="false"></eo:TabItem>
<eo:TabItem Text-Html="GRID 5" Visible="false"></eo:TabItem>
<eo:TabItem Text-Html="GRID 6" Visible="false"></eo:TabItem>
<eo:TabItem Text-Html="New Tab" RaisesServerEvent="True">
</eo:TabItem>
</Items>
</TopGroup>
<LookItems>
<eo:TabItem Image-Padding-Right="25" IsSeparator="True" ItemID="_Separator">
</eo:TabItem>
<eo:TabItem Height="21" ItemID="_Default" LeftIcon-SelectedUrl="00010605" LeftIcon-Url="00010604"
NormalStyle-CssText="background-image:url(00010602);background-repeat:repeat-x;color:black;font-weight:bold;"
RightIcon-SelectedUrl="00010607" RightIcon-Url="00010606" SelectedExpandedStyle-CssText="color:#ff7e00;"
SelectedStyle-CssText="background-image: url(00010603); background-repeat: repeat-x; font-weight: bold; color: #ff7e00;"
Text-Padding-Bottom="2" Text-Padding-Top="1">
<SubGroup ItemSpacing="5" Style-CssText="background-image:url(00010601);background-position-y:bottom;background-repeat:repeat-x;color:black;cursor:hand;font-family:Verdana;font-size:12px;">
</SubGroup>
</eo:TabItem>
</LookItems>
</eo:TabStrip>

<eo:MultiPage runat="server" id="MultiPage1" Height="600px" Width="100%">

<eo:PageView id="PageView1" runat="server" Width="100%">
<br />
<table class="style62">
<tr>
<td class="style155"


style="font-weight: 700; font-family: 'Times New Roman', Times, serif; font-size: large"
align="right" height="19px">
Select File:</td>
<td class="style156" height="19px">
<asp:Button ID="Browse" runat="server" Height="85%" Text="Browse"
Width="90%" style="margin-left: 0px" />
</td>
<td class="style157" colspan="2" height="19px">
&nbsp;</td>
<td





style="font-family: 'Times New Roman', Times, serif; font-size: large; font-weight: 700"
class="style158" height="19px">
<asp:Button ID="Import" runat="server" Height="85%" style="margin-left: 0px"
Text="Import File" Width="90%" />
</td>
<td class="style157" colspan="2" height="19px">
<asp:Button ID="ROWPOVButton" runat="server" Height="85%" Text="Row POV"
Width="90%" style="text-align: center" />
</td>
<td class="style159" align="center" height="19px">

<asp:Button ID="CreateGrid" runat="server" Height="85%"
onclick="CreateGrid_Click" Text="Set Dimension" Width="100px"
style="margin-left: 14px" />
</td>
<td class="style160" height="19px">
<asp:Button ID="AddRow" runat="server" Height="85%" Text="Add Row"
onclick="AddRow_Click" Width="90%"
ToolTip="Add a row to the current grid." />
</td>
<td class="style161" height="19px">
<asp:Button ID="Export" runat="server" Height="85%" Text="Export File"
Width="77px" ToolTip="Export the current grid to Excel." />
</td>
</tr>
<tr>
<td align="right" class="style94"
style="font-weight: 700; font-family: 'Times New Roman', Times, serif; font-size: large">
&nbsp;</td>
<td class="style147">
&nbsp;</td>
<td class="style85" colspan="2">
&nbsp;</td>
<td class="style148"
style="font-family: 'Times New Roman', Times, serif; font-size: large; font-weight: 700">
&nbsp;</td>
<td class="style149" colspan="2">
&nbsp;</td>
<td align="center" class="style154">
&nbsp;</td>
<td class="style152">
&nbsp;</td>
<td class="style146">
&nbsp;</td>
</tr>
<tr>
<td style="font-family: 'Times New Roman', Times, serif; font-weight: 700; font-size: large"
class="style127" rowspan="2">
&nbsp;&nbsp;&nbsp;Scenario<br />
<asp:DropDownList ID="ScenarioList" runat="server" meta:resourcekey="ScenarioListResource1"
Width="100px" ToolTip="Select the Scenario.">
</asp:DropDownList>
</td>
<td style="font-family: 'Times New Roman', Times, serif; font-weight: 700; font-size: large"
class="style129" rowspan="2">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Year<br />
<asp:DropDownList ID="YearList" runat="server" meta:resourcekey="YearListResource1"
Width="79px" Height="22px" ToolTip="Select the Year.">
</asp:DropDownList>
</td>
<td style="font-size: large; font-weight: 700; font-family: 'Times New Roman', Times, serif"
class="style133" rowspan="2">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Period<br />
<asp:DropDownList ID="PeriodList" runat="server" meta:resourcekey="PeriodListResource1"
Width="100px" style="margin-left: 10px" Height="22px"
ToolTip="Select the Period.">
</asp:DropDownList>
</td>
<td class="style162" rowspan="2"


style="font-size: large; font-weight: 700; font-family: 'Times New Roman', Times, serif">
&nbsp;</td>
<td style="font-family: 'Times New Roman', Times, serif; font-size: large; font-weight: 700"
class="style123" rowspan="2">
&nbsp;&nbsp;&nbsp; Value<br /> &nbsp;<asp:DropDownList ID="ValueList" runat="server"
Height="22px" Width="112px" style="margin-left: 0px"
ToolTip="Select the Value dimension member.">
<asp:ListItem>Entity Currency</asp:ListItem>
</asp:DropDownList>
</td>
<td style="font-weight: 700; font-size: large; font-family: 'Times New Roman', Times, serif"
class="style112" align="center" rowspan="2">
&nbsp;&nbsp;Rows<br />
<asp:DropDownList ID="DropDownList6" runat="server" style="margin-left: 11px"
Height="22px" Width="47px">
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
<asp:ListItem>6</asp:ListItem>
<asp:ListItem>7</asp:ListItem>
<asp:ListItem>8</asp:ListItem>
<asp:ListItem>9</asp:ListItem>
<asp:ListItem>10</asp:ListItem>
</asp:DropDownList>
</td>
<td style="font-family: 'Times New Roman', Times, serif; font-weight: 700; font-size: large"
class="style79" align="center" colspan="2" rowspan="2">
Pivot Dimension
<asp:DropDownList ID="PivotDimensionDropDown" runat="server"
style="margin-left: 9px" Width="73%" Height="22px">
<asp:ListItem>Account</asp:ListItem>
<asp:ListItem>Entity</asp:ListItem>
<asp:ListItem>ICP</asp:ListItem>
<asp:ListItem>C1</asp:ListItem>
<asp:ListItem>C2</asp:ListItem>
<asp:ListItem>C3</asp:ListItem>
<asp:ListItem>C4</asp:ListItem>
</asp:DropDownList>
</td>
<td class="style107"
style="font-weight: 700; font-family: 'Times New Roman', Times, serif"
rowspan="2">
<asp:ListBox ID="SystemListBox" runat="server" Rows="3"
SelectionMode="Multiple" ToolTip="Select products to integrate with.">
<asp:ListItem>HFM</asp:ListItem>
<asp:ListItem>Essbase</asp:ListItem>
<asp:ListItem>Planning</asp:ListItem>
</asp:ListBox>
</td>
<td class="style114"
style="font-weight: 700; font-family: 'Times New Roman', Times, serif">
<asp:Button ID="Retrieve" runat="server" Height="75%" style="margin-left: 5px"
Text="Retrieve" Width="64px"
ToolTip="Retrieve data from the selected systems." />
</td>
</tr>
<tr>
<td class="style136"
style="font-weight: 700; font-family: 'Times New Roman', Times, serif">
<asp:Button ID="Post" runat="server" Height="75%" style="margin-top: 0px; margin-left: 5px;"
Text="Post" Width="64px" ToolTip="Post data to the selected systems." />
</td>
</tr>
</table>

<br />
<br />

<script type="text/javascript">

var id1 = '<%=((EO.Web.CustomColumn)EntryGrid.Columns[2]).EditorInstance.FindControl("SelectMember").ClientID%>';

function on_begin_edit(cell) {
//Get the current cell value
var v = cell.getValue();

//Use index 0 if there is no value
if (v == null)
v = 0;

//Load the value into our drop down box
var dropDownBox = document.getElementById(id1);
dropDownBox.value = v;
}
function on_end_edit(cell) {
//Get the new value from the drop down box
var dropDownBox = document.getElementById(id1);
var v = dropDownBox.value;


//Return the new value to the grid
return v;
}


</script>

<eo:Grid ID="EntryGrid" runat="server" AllowNewItem="True"
BorderColor="#7F9DB9" BorderWidth="1px" ClientSideOnItemSelected=""
ColumnHeaderAscImage="~/Images/Grid/XP/header_asc.gif"
ColumnHeaderDescImage="~/Images/Grid/XP/header_desc.gif"
ColumnHeaderDividerImage="~/Images/Grid/XP/header_divider.gif"
EditCellIndex="3" EnableKeyboardNavigation="True" EnableTheming="False"
FixedColumnCount="1" Font-Bold="False" Font-Italic="False" Font-Names="Tahoma"
Font-Overline="False" Font-Size="8.75pt" Font-Strikeout="False"
Font-Underline="False" GoToBoxVisible="True" GridLineColor="220, 223, 228"
GridLines="Both" Height="200px" meta:resourcekey="EntryGridResource1"
RunningMode="Callback" SelectedCellIndex="3" Width="93%"
EditItemIndex="1" SelectedItemIndex="1">
<ItemStyles>
<eo:GridItemStyleSet>
<ItemStyle CssText="background-color: white" />
<ItemHoverStyle CssText="background-color: whitesmoke" />
<SelectedStyle CssText="background-color:#cccccc;color:white;" />
<FixedColumnCellStyle CssText="border-right: #d6d2c2 1px solid; padding-right: 10px; border-top: #faf9f4 1px solid; border-left: #faf9f4 1px solid; border-bottom: #d6d2c2 1px solid; background-color: #ebeadb; text-align: right; color: black;" />
<CellStyle CssText="padding-left:8px;padding-top:2px;white-space:nowrap;" />
</eo:GridItemStyleSet>
</ItemStyles>
<ColumnHeaderTextStyle CssText="" />
<ColumnHeaderStyle CssText="background-image:url('~/Images/Grid/XP/header_normal.gif');padding-left:8px;padding-top:3px;" />
<Columns>
<eo:RowNumberColumn HeaderText="" Width="35">
</eo:RowNumberColumn>
<eo:EditCommandColumn Name="edit" Width="40">
</eo:EditCommandColumn>
<eo:CustomColumn HeaderText="Dimension Member" ClientSideBeginEdit="on_begin_edit" ClientSideEndEdit="on_end_edit" Width="120">
<EditorTemplate>
<asp:DropDownList ID="SelectMember" runat="server" Width="120px">
</asp:DropDownList>
</EditorTemplate>
</eo:CustomColumn>

<eo:TextBoxColumn AllowSort="True" DataField="amount" HeaderText="Amount" Width="90"
Name="amount">
</eo:TextBoxColumn>
<eo:TextBoxColumn AllowSort="True" DataField="account" HeaderText="Account"
Name="account">
</eo:TextBoxColumn>
<eo:TextBoxColumn AllowSort="True" DataField="entity" HeaderText="Entity"
Name="entity">
</eo:TextBoxColumn>
<eo:TextBoxColumn AllowSort="True" DataField="icp" HeaderText="ICP" Name="icp">
</eo:TextBoxColumn>
<eo:TextBoxColumn DataField="c1" HeaderText="C1" Name="c1">
</eo:TextBoxColumn>
<eo:TextBoxColumn DataField="c2" HeaderText="C2" Name="c2">
</eo:TextBoxColumn>
<eo:TextBoxColumn DataField="c3" HeaderText="C3" Name="c3">
</eo:TextBoxColumn>
<eo:TextBoxColumn DataField="c4" HeaderText="C4" Name="c4">
</eo:TextBoxColumn>
</Columns>
<ColumnTemplates>
<eo:TextBoxColumn>
<TextBoxStyle CssText="BORDER-RIGHT: #7f9db9 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7f9db9 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 8.75pt; PADDING-BOTTOM: 1px; MARGIN: 0px; BORDER-LEFT: #7f9db9 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: #7f9db9 1px solid; FONT-FAMILY: Tahoma" />
</eo:TextBoxColumn>
<eo:DateTimeColumn>
<DatePicker ControlSkinID="None" DayCellHeight="16" DayCellWidth="19"
DayHeaderFormat="FirstLetter" DisabledDates="" OtherMonthDayVisible="True"
SelectedDates="" TitleLeftArrowImageUrl="DefaultSubMenuIconRTL"
TitleRightArrowImageUrl="DefaultSubMenuIcon">
<TodayStyle CssText="font-family: tahoma; font-size: 12px; border-right: #bb5503 1px solid; border-top: #bb5503 1px solid; border-left: #bb5503 1px solid; border-bottom: #bb5503 1px solid" />
<SelectedDayStyle CssText="font-family: tahoma; font-size: 12px; background-color: #fbe694; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<DisabledDayStyle CssText="font-family: tahoma; font-size: 12px; color: gray; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<PickerStyle CssText="border-bottom-color:#7f9db9;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#7f9db9;border-left-style:solid;border-left-width:1px;border-right-color:#7f9db9;border-right-style:solid;border-right-width:1px;border-top-color:#7f9db9;border-top-style:solid;border-top-width:1px;font-family:Courier New;font-size:8pt;margin-bottom:0px;margin-left:0px;margin-right:0px;margin-top:0px;padding-bottom:1px;padding-left:2px;padding-right:2px;padding-top:2px;" />
<CalendarStyle CssText="background-color: white; border-right: #7f9db9 1px solid; padding-right: 4px; border-top: #7f9db9 1px solid; padding-left: 4px; font-size: 9px; padding-bottom: 4px; border-left: #7f9db9 1px solid; padding-top: 4px; border-bottom: #7f9db9 1px solid; font-family: tahoma" />
<TitleArrowStyle CssText="cursor:hand" />
<DayHoverStyle CssText="font-family: tahoma; font-size: 12px; border-right: #fbe694 1px solid; border-top: #fbe694 1px solid; border-left: #fbe694 1px solid; border-bottom: #fbe694 1px solid" />
<MonthStyle CssText="font-family: tahoma; font-size: 12px; margin-left: 14px; cursor: hand; margin-right: 14px" />
<TitleStyle CssText="background-color:#9ebef5;font-family:Tahoma;font-size:12px;padding-bottom:2px;padding-left:6px;padding-right:6px;padding-top:2px;" />
<OtherMonthDayStyle CssText="font-family: tahoma; font-size: 12px; color: gray; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<DayHeaderStyle CssText="font-family: tahoma; font-size: 12px; border-bottom: #aca899 1px solid" />
<DayStyle CssText="font-family: tahoma; font-size: 12px; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
</DatePicker>
</eo:DateTimeColumn>
<eo:MaskedEditColumn>
<MaskedEdit ID="MaskedEdit1" runat="server" ControlSkinID="None"
TextBoxStyle-CssText="BORDER-RIGHT: #7f9db9 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7f9db9 1px solid; PADDING-LEFT: 2px; PADDING-BOTTOM: 1px; MARGIN: 0px; BORDER-LEFT: #7f9db9 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: #7f9db9 1px solid; font-family:Courier New;font-size:8pt;">
</MaskedEdit>
</eo:MaskedEditColumn>
</ColumnTemplates>
<ContentPaneStyle CssText="border-bottom-color:#7f9db9;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#7f9db9;border-left-style:solid;border-left-width:1px;border-right-color:#7f9db9;border-right-style:solid;border-right-width:1px;border-top-color:#7f9db9;border-top-style:solid;border-top-width:1px;" />
<FooterStyle CssText="padding-bottom:4px;padding-left:4px;padding-right:4px;padding-top:4px;" />
<GoToBoxStyle CssText="BORDER-RIGHT: #7f9db9 1px solid; BORDER-TOP: #7f9db9 1px solid; BORDER-LEFT: #7f9db9 1px solid; WIDTH: 40px; BORDER-BOTTOM: #7f9db9 1px solid" />
</eo:Grid>
</eo:PageView>

<eo:PageView id="PageView2" runat="server" Width="100%" >
</eo:PageView>

<eo:PageView id="PageView3" runat="server" Width="100%">
</eo:PageView>

<eo:PageView id="PageView4" runat="server" Width="100%">
</eo:PageView>

<eo:PageView id="PageView5" runat="server" Width="100%">
</eo:PageView>

<eo:PageView id="PageView6" runat="server" Width="100%">
</eo:PageView>

<eo:PageView id="PageView7" runat="server" Width="100%">
</eo:PageView>

</eo:MultiPage>