Aug 07, 2013, 6:24 PM
Layout Design using Master page
HI Team,
Please see the following code
===============
Master page code
===============
Home Page code to view in browser
=========================
=======================
Result page Code
=======================
When I clicked on menuItem then the Result.aspx page is added to the tabpanel.
In Result.aspx I have used Formpanel with border layout and defined two regions.
Here my question is I am unable to view the design properly
I don't want to use height property to controls(Height=600 for formpanel)
I want to use layout's to fit the design to all the browsers.
Any solution is helpful
Thanks
Nagamalli
Please see the following code
===============
Master page code
===============
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="LayoutDemo.master.cs"
Inherits="MasterLayout.LayoutDemo" %>
<%@ Register Namespace="Ext.Net" Assembly="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>
<script type="text/javascript">
var addTab = function (tabPanel, id, url, menuItem, title) {
var tab = tabPanel.getComponent(id);
if (!tab) {
tab = tabPanel.add({
id: id,
title: title,
closable: true,
menuItem: menuItem,
loader: {
url: url,
renderer: "frame",
loadMask: {
showMask: true,
msg: "Loading " + url + "..."
}
}
});
}
tabPanel.setActiveTab(tab);
}
</script>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div>
<ext:ResourceManager ID="resourceManager" runat="server">
</ext:ResourceManager>
<ext:Viewport ID="Viewport1" runat="server" Layout="BorderLayout" IDMode="Explicit"
IsDynamic="False" Namespace="App" RenderXType="True">
<Items>
<ext:Panel ID="pnlWest" Region="West" Width="200" Collapsible="true" runat="server"
Title="MenuPanel">
<Items>
<ext:MenuPanel ID="mnuPanel" runat="server" Title="MenuPanel">
<Menu runat="server" ID="adminMenu">
<Items>
<ext:MenuItem ID="miViewResults" runat="server" Text="View Result">
<Listeners>
<Click Handler="addTab(#{TabPanel1},'idmiViewResults','Result.aspx',this,'Results')">
</Click>
</Listeners>
</ext:MenuItem>
</Items>
</Menu>
</ext:MenuPanel>
</Items>
</ext:Panel>
<ext:TabPanel ID="TabPanel1" runat="server" Region="Center">
<Items>
<ext:Panel runat="server" Title="Sample" ID="panelHome">
<Items>
</Items>
</ext:Panel>
</Items>
</ext:TabPanel>
</Items>
</ext:Viewport>
<asp:ContentPlaceHolder ID="CPH" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
=========================Home Page code to view in browser
=========================
<%@ Page Title="" Language="C#" MasterPageFile="~/LayoutDemo.Master" AutoEventWireup="true" CodeBehind="Home.aspx.cs" Inherits="MasterLayout.Home" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="CPH" runat="server">
</asp:Content>
=======================
Result page Code
=======================
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Result.aspx.cs" Inherits="MasterLayout.Result" %>
<%@ Register Namespace="Ext.Net" Assembly="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">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:FormPanel ID="fpResults" runat="server" Layout="BorderLayout">
<Items>
<ext:Panel ID="pnlEast" runat="server" Width="300" Region="East" Collapsible="true">
<Content>
<table>
<tr>
<td>
List of records in gridpanel
</td>
</tr>
</table>
</Content>
</ext:Panel>
<ext:Panel ID="pnlCenter" runat="server" Region="Center" >
<Content>
<table>
<tr>
<td>
Data to save
</td>
</tr>
</table>
</Content>
</ext:Panel>
</Items>
</ext:FormPanel>
</form>
</body>
</html>
==============================When I clicked on menuItem then the Result.aspx page is added to the tabpanel.
In Result.aspx I have used Formpanel with border layout and defined two regions.
Here my question is I am unable to view the design properly
I don't want to use height property to controls(Height=600 for formpanel)
I want to use layout's to fit the design to all the browsers.
Any solution is helpful
Thanks
Nagamalli