Aug 08, 2012, 7:48 AM
[CLOSED] GridView - Locking and Multi Header
Hi,
In my attached example, I've created 3 examples.
1.) Multi-Header GridPanel
2.) GridPanel with the first column locked
3.) 1 and 2 combined.
Results:
1.) I'm able to display multiple headers
2.) I'm able to lock the first column
3.) No object is displayed
My question is:
Can one combine the 2 together?
In my attached example, I've created 3 examples.
1.) Multi-Header GridPanel
2.) GridPanel with the first column locked
3.) 1 and 2 combined.
Results:
1.) I'm able to display multiple headers
2.) I'm able to lock the first column
3.) No object is displayed
My question is:
Can one combine the 2 together?
<%@ Page Language="C#" %>
<%@ 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">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Test Page</title>
</head>
<body>
<ext:ResourceManager runat="server" />
<ext:FormPanel
ID="fpExample"
runat="server"
Header="false"
AutoHeight="true"
BodyBorder="false"
Border="false"
BodyStyle="background-color:#EFEFEF"
Padding="5"
DefaultAnchor="0">
<Items>
<ext:ColumnLayout
runat="server">
<Columns>
<ext:LayoutColumn ColumnWidth="0.3">
<ext:FieldSet
runat="server"
Title="Example 1: Multi Header"
Collapsible="false"
Height="350"
Width="350"
Layout="formlayout">
<Items>
<ext:GridPanel
ID="gpMultiHeader"
runat="server"
Height="300"
Width="300"
MaxWidth="675"
Border="true"
BodyBorder="true"
StripeRows="true"
TrackMouseOver="false"
EnableColumnHide="false"
EnableColumnMove="false"
EnableColumnResize="false"
EnableDragDrop="false"
AutoScroll="true">
<Store>
<ext:Store runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="ID" />
<ext:RecordField Name="title" />
<ext:RecordField Name="firstname" />
<ext:RecordField Name="surname" />
<ext:RecordField Name="contactno" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:CommandColumn
Width="60"
Locked="false">
<Commands>
<ext:GridCommand
Icon="Delete"
CommandName="Delete">
<ToolTip Text="Delete" />
</ext:GridCommand>
<ext:CommandSeparator />
<ext:GridCommand
Icon="NoteEdit"
CommandName="Edit">
<ToolTip Text="Edit" />
</ext:GridCommand>
</Commands>
</ext:CommandColumn>
<ext:Column
Header="Title"
Align="Left"
Width="150"
DataIndex="title"
Sortable="false"
MenuDisabled="true"
Editable="false" />
<ext:Column
Header="Firstname"
Width="150"
DataIndex="firstname"
Sortable="false"
MenuDisabled="true"
Editable="false" />
<ext:Column
Header="Surname"
Width="150"
DataIndex="surname"
Sortable="false"
MenuDisabled="true"
Editable="false" />
<ext:Column
Header="Contact Number"
Width="150"
DataIndex="contactno"
Sortable="false"
MenuDisabled="true"
Editable="false" />
</Columns>
</ColumnModel>
<View>
<ext:GridView runat="server" >
<HeaderGroupRows>
<ext:HeaderGroupRow>
<Columns>
<ext:HeaderGroupColumn Align="Center" ColSpan="1" Header="" />
<ext:HeaderGroupColumn Align="Center" ColSpan="4" Header="Contact" />
</Columns>
</ext:HeaderGroupRow>
</HeaderGroupRows>
</ext:GridView>
</View>
</ext:GridPanel>
</Items>
</ext:FieldSet>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth="0.3">
<ext:FieldSet
runat="server"
Title="Example 2: Locking Column"
Collapsible="false"
Height="350"
Width="350"
Layout="formlayout">
<Items>
<ext:GridPanel
ID="gpLocking"
runat="server"
Height="300"
Width="300"
MaxWidth="675"
Border="true"
BodyBorder="true"
StripeRows="true"
TrackMouseOver="false"
EnableColumnHide="false"
EnableColumnMove="false"
EnableColumnResize="false"
EnableDragDrop="false"
AutoScroll="true">
<Store>
<ext:Store runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="ID" />
<ext:RecordField Name="title" />
<ext:RecordField Name="firstname" />
<ext:RecordField Name="surname" />
<ext:RecordField Name="contactno" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:CommandColumn
Width="60"
Locked="true">
<Commands>
<ext:GridCommand
Icon="Delete"
CommandName="Delete">
<ToolTip Text="Delete" />
</ext:GridCommand>
<ext:CommandSeparator />
<ext:GridCommand
Icon="NoteEdit"
CommandName="Edit">
<ToolTip Text="Edit" />
</ext:GridCommand>
</Commands>
</ext:CommandColumn>
<ext:Column
Header="Title"
Align="Left"
Width="150"
DataIndex="title"
Sortable="false"
MenuDisabled="true"
Editable="false" />
<ext:Column
Header="Firstname"
Width="150"
DataIndex="firstname"
Sortable="false"
MenuDisabled="true"
Editable="false" />
<ext:Column
Header="Surname"
Width="150"
DataIndex="surname"
Sortable="false"
MenuDisabled="true"
Editable="false" />
<ext:Column
Header="Contact Number"
Width="150"
DataIndex="contactno"
Sortable="false"
MenuDisabled="true"
Editable="false" />
</Columns>
</ColumnModel>
<View>
<ext:LockingGridView runat="server" />
</View>
</ext:GridPanel>
</Items>
</ext:FieldSet>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth="0.3">
<ext:FieldSet
runat="server"
Title="Example 3: Multi Header & Locking Column"
Collapsible="false"
Height="350"
Width="350"
Layout="formlayout">
<Items>
<ext:GridPanel
ID="gpMultiLocking"
runat="server"
Height="300"
Width="300"
MaxWidth="675"
Border="true"
BodyBorder="true"
StripeRows="true"
TrackMouseOver="false"
EnableColumnHide="false"
EnableColumnMove="false"
EnableColumnResize="false"
EnableDragDrop="false"
AutoScroll="true">
<Store>
<ext:Store runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="ID" />
<ext:RecordField Name="title" />
<ext:RecordField Name="firstname" />
<ext:RecordField Name="surname" />
<ext:RecordField Name="contactno" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:CommandColumn
Width="60"
Locked="true">
<Commands>
<ext:GridCommand
Icon="Delete"
CommandName="Delete">
<ToolTip Text="Delete" />
</ext:GridCommand>
<ext:CommandSeparator />
<ext:GridCommand
Icon="NoteEdit"
CommandName="Edit">
<ToolTip Text="Edit" />
</ext:GridCommand>
</Commands>
</ext:CommandColumn>
<ext:Column
Header="Title"
Align="Left"
Width="150"
DataIndex="title"
Sortable="false"
MenuDisabled="true"
Editable="false" />
<ext:Column
Header="Firstname"
Width="150"
DataIndex="firstname"
Sortable="false"
MenuDisabled="true"
Editable="false" />
<ext:Column
Header="Surname"
Width="150"
DataIndex="surname"
Sortable="false"
MenuDisabled="true"
Editable="false" />
<ext:Column
Header="Contact Number"
Width="150"
DataIndex="contactno"
Sortable="false"
MenuDisabled="true"
Editable="false" />
</Columns>
</ColumnModel>
<View>
<ext:LockingGridView runat="server">
<HeaderGroupRows>
<ext:HeaderGroupRow>
<Columns>
<ext:HeaderGroupColumn Align="Center" ColSpan="1" Header="" />
<ext:HeaderGroupColumn Align="Center" ColSpan="4" Header="Contact" />
</Columns>
</ext:HeaderGroupRow>
</HeaderGroupRows>
</ext:LockingGridView>
</View>
</ext:GridPanel>
</Items>
</ext:FieldSet>
</ext:LayoutColumn>
</Columns>
</ext:ColumnLayout>
</Items>
</ext:FormPanel>
</body>
</html>
Last edited by Daniil; Aug 13, 2012 at 6:25 AM.
Reason: [CLOSED]