Jun 19, 2012, 6:05 PM
[FIXED] [#91] ColumnHeaderGroup HiddenColumns
[SENCHA bug ticket is EXTJSIV-6598]
[4.1.1 rc2] Group Column "hidden: true" doesn't hide its child columns
[SENCHA bug ticket is EXTJSIV-8115]
[4.2.0 beta] "hidden: true" of grid column with inner columns causes error
I used the Group Header Column example again to detail this issue.
Not sure if you would consider this a bug or if the developer should not assume.
I have a ColumnHeaderGroup named "Stock Price" that I have added the attribute Hidden="true". The 3 columns under it "Price", "Change" and "Change %" I did not add the attribute Hidden, assuming that it would inherit it from its parent.
When the form is displayed the hidden ColumnHeaderGroup is not shown but the other data is mis-aligned. I needed to add the attribute Hidden="true" to all the child columns also to make it display properly.
Your thoughts ...
[4.1.1 rc2] Group Column "hidden: true" doesn't hide its child columns
[SENCHA bug ticket is EXTJSIV-8115]
[4.2.0 beta] "hidden: true" of grid column with inner columns causes error
I used the Group Header Column example again to detail this issue.
Not sure if you would consider this a bug or if the developer should not assume.
I have a ColumnHeaderGroup named "Stock Price" that I have added the attribute Hidden="true". The 3 columns under it "Price", "Change" and "Change %" I did not add the attribute Hidden, assuming that it would inherit it from its parent.
When the form is displayed the hidden ColumnHeaderGroup is not shown but the other data is mis-aligned. I needed to add the attribute Hidden="true" to all the child columns also to make it display properly.
Your thoughts ...
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.Store1.DataSource = this.Data;
this.Store1.DataBind();
}
}
private object[] Data
{
get
{
return new object[]
{
new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" }
};
}
}
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Grouped Header Example - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" type="text/css" />
<style type="text/css">
/* style rows on mouseover */
.x-grid-row-over .x-grid-cell-inner {
font-weight: bold;
}
</style>
<script type="text/javascript">
var template = '<span style="color:{0};">{1}</span>';
var change = function (value) {
return Ext.String.format(template, (value > 0) ? "green" : "red", value);
};
var pctChange = function (value) {
return Ext.String.format(template, (value > 0) ? "green" : "red", value + "%");
};
</script>
</head>
<body>
<ext:ResourceManager runat="server" />
<h1>Grouped Header Example</h1>
<p>This example shows how to create a grid with column headers which are nested within category headers.</p>
<p>Category headers do not reference Model fields via a <code>dataIndex</code>, rather they contain
child header definitions (which may themselves either contain a <code>dataIndex</code> or more levels of headers).</p>
<ext:GridPanel
ID="GridPanel1"
runat="server"
Title="Grouped Header Grid"
Width="600"
ColumnLines="true"
Height="350">
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="company" />
<ext:ModelField Name="price" Type="Float" />
<ext:ModelField Name="change" Type="Float" />
<ext:ModelField Name="pctChange" Type="Float" />
<ext:ModelField Name="lastChange" Type="Date" DateFormat="M/d hh:mmtt" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:Column runat="server" Text="Company" DataIndex="company" Flex="1" Sortable="false" />
<ext:Column runat="server" Text="Stock Price" Hidden="true">
<Columns>
<ext:Column runat="server" Text="Price" DataIndex="price" Width="75" Sortable="true">
<Renderer Format="UsMoney" />
</ext:Column>
<ext:Column runat="server" Text="Change" DataIndex="change" Width="75" Sortable="true">
<Renderer Fn="change" />
</ext:Column>
<ext:Column runat="server" Text="Change %" DataIndex="pctChange" Width="75" Sortable="true">
<Renderer Fn="pctChange" />
</ext:Column>
</Columns>
</ext:Column>
<ext:DateColumn runat="server" Text="Last Updated" DataIndex="lastChange" Width="85" Sortable="true" Format="dd/MM/yyyy" />
</Columns>
</ColumnModel>
</ext:GridPanel>
</body>
</html
Last edited by cwolcott; Mar 07, 2013 at 1:33 PM.
Originally Posted by RCN
