[引导贴]如何在子页面中向父页面添加Tab，如何关闭当前Tab - FineUI 官方论坛

<form id="form1" runat="server">
<ext:PageManager ID="PageManager1" AutoSizePanelID="RegionPanel1" runat="server"></ext:PageManager>
<ext:RegionPanel ID="RegionPanel1" ShowBorder="false" runat="server">
<Regions>
<ext:Region ID="Region1" Margins="0 0 0 0" ShowBorder="false" Height="30px" ShowHeader="false"
Position="Top" Layout="Fit" runat="server">
<Toolbars>
<ext:Toolbar runat="server">
<Items>
<ext:Button runat="server" Text="打开GRID页" OnClick="OpenGrid"></ext:Button>
</Items>
</ext:Toolbar>
</Toolbars>
</ext:Region>
<ext:Region ID="mainRegion" ShowHeader="false" Layout="Fit" Margins="0 0 0 0" Position="Center"
runat="server">
<Items>
<ext:TabStrip ID="mainTabStrip" EnableTabCloseMenu="true" ShowBorder="false" runat="server">
<Tabs>
<ext:Tab Title="首页" Layout="Fit" Icon="House" runat="server">
<Items>
<ext:ContentPanel ShowBorder="false" BodyPadding="10px" ShowHeader="false" AutoScroll="true"
CssClass="intro" runat="server">
首页
</ext:ContentPanel>
</Items>
</ext:Tab>
</Tabs>
</ext:TabStrip>
</Items>
</ext:Region>
</Regions>
</ext:RegionPanel>
</form>
<script type="text/javascript">
<font color="#ff0000"> function onReady() {
var mainTabStrip = Ext.getCmp("<%=mainTabStrip.ClientID %>");
// 公开添加示例标签页的方法
window.addExampleTab = function (id, url, text, icon, refreshWhenExist) {
// 动态添加一个标签页
// mainTabStrip：选项卡实例
// id：选项卡ID
// url: 选项卡IFrame地址
// text：选项卡标题
// icon：选项卡图标
// addTabCallback：创建选项卡前的回调函数（接受tabConfig参数）
// refreshWhenExist：添加选项卡时，如果选项卡已经存在，是否刷新内部IFrame
X.util.addMainTab(mainTabStrip, id, url, text, icon, null, refreshWhenExist);
};
window.removeActiveTab = function () {
var activeTab = mainTabStrip.getActiveTab();
mainTabStrip.removeTab(activeTab.id);
};
}</font>
</script>

复制代码

protected void OpenGrid(object sender, EventArgs e)
{
FineUI.PageContext.RegisterStartupScript(mainTabStrip.GetAddTabReference("tabGrid3", "WebForm3.aspx", "TabGrid", true));
}

复制代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<ext:PageManager runat="server" AutoSizePanelID="Grid1"/>
<ext:Grid runat="server" ID="Grid1"<font color="#ff0000"><b> OnRowCommand="GridRowCommand"</b></font>>
<Columns>
<ext:BoundField DataField="ID" HeaderText="ID"/>
<ext:BoundField DataField="DeptName" HeaderText="部门名称"/>
<ext:BoundField DataField="CustomerName" HeaderText="企业名称"/>
<ext:BoundField DataField="Mobile" HeaderText="手机"/>
<ext:BoundField DataField="Position" HeaderText="职位"/>
<ext:BoundField DataField="Status" HeaderText="状态"/>
<font color="#ff0000"><b> <ext:LinkButtonField TextAlign="Center" Width="30px" Icon="TabAdd" ToolTip="打开Tab1"
ColumnID="deleteField1" CommandName="OpenTab1" />
<ext:LinkButtonField TextAlign="Center" Width="30px" Icon="TabAdd" ToolTip="打开Tab2"
ColumnID="deleteField2" CommandName="OpenTab2" /></b></font>
</Columns>
</ext:Grid>
</form>
</body>
</html>

复制代码

protected void Page_Load(object sender, EventArgs e)
{
if(!IsPostBack)
{
BindGrid();
}
}
private void BindGrid()
{
Grid1.DataSource = (new Employee()).GetList();
Grid1.DataBind();
}
protected void GridRowCommand(object sender, FineUI.GridCommandEventArgs e)
{
switch (e.CommandName)
{
case "OpenTab1":
<font color="#ff0000"><b> FineUI.PageContext.RegisterStartupScript(
"parent.addExampleTab("gridTab1", "tabContent1.aspx", "LinkButton1")");</b></font>
break;
case "OpenTab2":
<font color="#ff0000"><b> FineUI.PageContext.RegisterStartupScript(
"parent.addExampleTab("gridTab2", "</b></font><b style="color: rgb(255, 0, 0);">tabContent2</b><font color="#ff0000"><b>.aspx", "LinkButton2")");</b></font>
break;
}
}

复制代码

<form id="form1" runat="server">
<ext:PageManager runat="server" />
<ext:Button ID="Button2" runat="server" Icon="Delete" OnClick="CloseCurrentTab" Text="关闭我"></ext:Button>
</form>

复制代码

protected void CloseCurrentTab(object sender, EventArgs e)
{
<font color="#ff0000"> PageContext.RegisterStartupScript("parent.removeActiveTab()");</font>
}

复制代码

hookPostBack: function () {
if (typeof (__doPostBack) != 'undefined') {
__doPostBack = f__doPostBack;
}
}

复制代码