Aug 06, 2012, 3:06 PM
Issue Regarding to open a window in New Tab
Hi Sir,
I have an issue regarding to the new tab. Sir I am showing you scenario so you should help me i I have put tabpanel in Home.aspx this panel consist one page link which opens in new tab ie. Page1.aspx. On page1 there is a grid. while double click to the grid which open Page2.aspx in to the same tab. I need to open this in to different tab. So can you provide me a solution to open this in different tab. I have attach one project so it clears you about issue.
Thanks
Home.aspx
page1.aspx.cs
page2.aspx
page2.aspx.cs
I have an issue regarding to the new tab. Sir I am showing you scenario so you should help me i I have put tabpanel in Home.aspx this panel consist one page link which opens in new tab ie. Page1.aspx. On page1 there is a grid. while double click to the grid which open Page2.aspx in to the same tab. I need to open this in to different tab. So can you provide me a solution to open this in different tab. I have attach one project so it clears you about issue.
Thanks
Home.aspx
<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true"
CodeFile="Home.aspx.cs" Inherits="Home" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
<style type="text/css">
x.menu, .x-menu-list
{
color: White;
background-color: White !important;
}
</style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<script type="text/javascript">
var addTab = function(tabPanel, id, url, title) {
var tab = tabPanel.getComponent(id);
if (!tab) {
tab = tabPanel.add({
id: id,
title: title,
closable: true,
autoLoad: {
showMask: true,
url: url,
mode: "iframe",
maskMsg: "Loading " + url + "..."
}
});
tab.on("activate", function() {
var item = ctl00_ContentPlaceHolder1_MenuPanel1.menu.items.get(id + "_item");
if (item) {
ctl00_ContentPlaceHolder1_MenuPanel1.setSelection(item);
}
}, this);
}
tabPanel.setActiveTab(tab);
}
</script>
<ext:Panel ID="Panel1" runat="server" Title="HOME" AutoWidth="true" Height="650"
Layout="BorderLayout" DefaultCollapsible="false" DefaultSplit="true">
<Items>
<ext:Panel ID="Panel2" runat="server" BodyStyl="color: White" DefaultPadding="6"
Width="200" MaxWidth="200" MinWidth="200" Layout="Accordion" Region="West" DefaultBorder="false"
Collapsible="true">
<Items>
<ext:MenuPanel ID="MenuPanel1" BodyStyle="color: White" Title="Menu" runat="server">
<Menu ID="Menu" runat="server">
<Items>
<ext:MenuItem ID="MenuItem1" runat="server" Text="Page1" Icon="Page" >
<Listeners>
<Click Handler="addTab(#{TabPanel1}, 'idClt', 'Page1.aspx','Page1');" />
</Listeners>
</ext:MenuItem>
</Items>
</Menu>
</ext:MenuPanel>
</Items>
</ext:Panel>
<ext:TabPanel ID="TabPanel1" runat="server" Region="Center" Collapsible="false">
<Plugins>
<ext:TabScrollerMenu PageSize="5" MaxText="100" />
<ext:TabCloseMenu />
</Plugins>
</ext:TabPanel>
</Items>
</ext:Panel>
</asp:Content>
Page1.aspx<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true"
CodeFile="Page1.aspx.cs" Inherits="Page1" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<ext:FormPanel runat="server" Height="600" AnchorHorizontal="100%">
<Items>
<ext:GridPanel ID="gridPage1" Height="200" Title="Demo Grid" runat="server" AutoWidth="true">
<Store>
<ext:Store runat="server">
<Reader>
<ext:ArrayReader IDProperty="ID">
<Fields>
<ext:RecordField Name="ID" Type="Int" />
<ext:RecordField Name="Name" Type="String" />
<ext:RecordField Name="Age" Type="Int" />
</Fields>
</ext:ArrayReader>
</Reader>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:Column ColumnID="ColID" Header="ID" DataIndex="ID" />
<ext:Column ColumnID="ColName" Header="Name" DataIndex="Name" />
<ext:Column ColumnID="ColAge" Header="Age" DataIndex="Age" />
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true" />
</SelectionModel>
<DirectEvents>
<RowClick OnEvent="ShowDayClosing" Failure="Ext.MessageBox.Alert('Load Failed', 'Error....')">
<ExtraParams>
<ext:Parameter Name="ID" Value="params[0].getStore().getAt(params[1]).id" Mode="Raw" />
</ExtraParams>
</RowClick>
</DirectEvents>
</ext:GridPanel>
</Items>
</ext:FormPanel>
</asp:Content>
page1.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
Store store = this.gridPage1.GetStore();
store.DataSource = new object[]
{
new object[] {1,"Jackson", 12},
new object[] {2,"Michel", 55},
new object[] {3,"Rock", 60}
};
store.DataBind();
}
}
public void ShowDayClosing(object sender, Ext.Net.DirectEventArgs e)
{
string id = e.ExtraParams[0].Value;
Response.Redirect("Page2.aspx?ID="+id);
}
page2.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Page2.aspx.cs" Inherits="Page2" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!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">
<div>
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:TextField ID="txtname" runat="server" FieldLabel="Name" />
<ext:TextField ID="txtAge" runat="server" FieldLabel="Age" />
</div>
</form>
</body>
</html>
page2.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
string id = Request.QueryString["ID"];
if (id == "1")
{
txtname.Text = "Jackson";
txtAge.Text = "12";
}
else if (id == "2")
{
txtname.Text = "Michel";
txtAge.Text = "55";
}
else
{
txtname.Text = "Rock";
txtAge.Text = "60";
}
}
}