渲染 Grid 面板 Ext.Net 的最后一列
Posted
技术标签:
【中文标题】渲染 Grid 面板 Ext.Net 的最后一列【英文标题】：Rendering the last column of Grid panel Ext.Net 【发布时间】：2012-10-10 08:12:36 【问题描述】：1) 在某些情况下，网格面板的最后一列无法正确呈现。请看下图。
有什么问题？
以下是标记代码：
<ext:Panel ID="pnl_DataView_EconomicArrange" runat="server" Width="850" Height="600" Title="Economic"
Padding="6" Layout="FitLayout">
<Content>
<ext:GridPanel ID="GV_EconomicArrange" runat="server" Height="560" Width="840" Title="Economic"
AutoScroll="True" Border="True" Header="false" TrackMouseOver="true" Cls="gridFont"
Layout="FitLayout" AutoExpandColumn="MDate" StripeRows="true" >
<Store>
<ext:Store ID="Store_DataView" runat="server">
<Reader>
<ext:JsonReader IDProperty="EconomivArrange">
<Fields>
<ext:RecordField Name="LowPrice" />
<ext:RecordField Name="HighPrice" />
<ext:RecordField Name="H1_Integrated" />
<ext:RecordField Name="H2_Integrated" />
<ext:RecordField Name="H3_Integrated" />
<ext:RecordField Name="H4_Integrated" />
<ext:RecordField Name="H5_Integrated" />
<ext:RecordField Name="H6_Integrated" />
<ext:RecordField Name="H7_Integrated" />
<ext:RecordField Name="H8_Integrated" />
<ext:RecordField Name="H9_Integrated" />
<ext:RecordField Name="H10_Integrated" />
<ext:RecordField Name="H11_Integrated" />
<ext:RecordField Name="H12_Integrated" />
<ext:RecordField Name="H13_Integrated" />
<ext:RecordField Name="H14_Integrated" />
<ext:RecordField Name="H15_Integrated" />
<ext:RecordField Name="H16_Integrated" />
<ext:RecordField Name="H17_Integrated" />
<ext:RecordField Name="H18_Integrated" />
<ext:RecordField Name="H19_Integrated" />
<ext:RecordField Name="H20_Integrated" />
<ext:RecordField Name="H21_Integrated" />
<ext:RecordField Name="H22_Integrated" />
<ext:RecordField Name="H23_Integrated" />
<ext:RecordField Name="H24_Integrated" />
<ext:RecordField Name="MDate" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
</Store>
<TopBar>
<ext:Toolbar ID="Toolbar1" runat="server">
<Items>
<ext:ToolbarFill ID="ToolbarFill1" runat="server" />
</Items>
</ext:Toolbar>
</TopBar>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" />
</SelectionModel>
<ColumnModel>
<Columns>
<ext:Column Header="Low Price" Width="60" Sortable="false" DataIndex="LowPrice" />
<ext:Column Header="High Price" Width="60" Sortable="false" DataIndex="HighPrice" />
<ext:Column Header="H 1" Width="50" Sortable="false" DataIndex="H1_Integrated" />
<ext:Column Header="H 2" Width="50" Sortable="false" DataIndex="H2_Integrated" />
<ext:Column Header="H 3" Width="50" Sortable="false" DataIndex="H3_Integrated" />
<ext:Column Header="H 4" Width="50" Sortable="false" DataIndex="H4_Integrated" />
<ext:Column Header="H 5" Width="50" Sortable="false" DataIndex="H5_Integrated" />
<ext:Column Header="H 6" Width="50" Sortable="false" DataIndex="H6_Integrated" />
<ext:Column Header="H 7" Width="50" Sortable="false" DataIndex="H7_Integrated" />
<ext:Column Header="H 8" Width="50" Sortable="false" DataIndex="H8_Integrated" />
<ext:Column Header="H 9" Width="50" Sortable="false" DataIndex="H9_Integrated" />
<ext:Column Header="H 10" Width="50" Sortable="false" DataIndex="H10_Integrated" />
<ext:Column Header="H 11" Width="50" Sortable="false" DataIndex="H11_Integrated" />
<ext:Column Header="H 12" Width="50" Sortable="false" DataIndex="H12_Integrated" />
<ext:Column Header="H 13" Width="50" Sortable="false" DataIndex="H13_Integrated" />
<ext:Column Header="H 14" Width="50" Sortable="false" DataIndex="H14_Integrated" />
<ext:Column Header="H 15" Width="50" Sortable="false" DataIndex="H15_Integrated" />
<ext:Column Header="H 16" Width="50" Sortable="false" DataIndex="H16_Integrated" />
<ext:Column Header="H 17" Width="50" Sortable="false" DataIndex="H17_Integrated" />
<ext:Column Header="H 18" Width="50" Sortable="false" DataIndex="H18_Integrated" />
<ext:Column Header="H 19" Width="50" Sortable="false" DataIndex="H19_Integrated" />
<ext:Column Header="H 20" Width="50" Sortable="false" DataIndex="H20_Integrated" />
<ext:Column Header="H 21" Width="50" Sortable="false" DataIndex="H21_Integrated" />
<ext:Column Header="H 22" Width="50" Sortable="false" DataIndex="H22_Integrated" />
<ext:Column Header="H 23" Width="50" Sortable="false" DataIndex="H23_Integrated" />
<ext:Column Header="H 24" Width="50" Sortable="false" DataIndex="H24_Integrated" />
<ext:Column Header="Date" Width="50" Sortable="false" DataIndex="MDate" Hidden="true" Hideable="false" />
</Columns>
</ColumnModel>
<LoadMask ShowMask="true" />
</ext:GridPanel>
</Content>
</ext:Panel>
在后面的代码中，我填写了一个数据表并绑定到存储数据源。
2) 您对本案有何看法：
当我使用水平滚动查看最后一列时： 1) 标题仍然是固定的，但行会移动。 2）最后两列样式消失了。 （详情请查看粉色行）
这里是标记代码：
<ext:Panel ID="pnl_DataView" runat="server" Title="Generation Information"
Padding="6" Layout="FitLayout">
<Items>
<ext:GridPanel ID="GV_DataView" runat="server" Title="Generation Information"
AutoScroll="True" Border="True" Header="false" TrackMouseOver="true" Layout="FitLayout"
Cls="gridFont">
<Store>
<ext:Store ID="Store_DataView" runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="MDate">
</ext:RecordField>
<ext:RecordField Name="DayName">
</ext:RecordField>
<ext:RecordField Name="DayOfYear">
</ext:RecordField>
<ext:RecordField Name="UnitCode">
</ext:RecordField>
<ext:RecordField Name="H1">
</ext:RecordField>
<ext:RecordField Name="H2">
</ext:RecordField>
<ext:RecordField Name="H3">
</ext:RecordField>
<ext:RecordField Name="H4">
</ext:RecordField>
<ext:RecordField Name="H5">
</ext:RecordField>
<ext:RecordField Name="H6">
</ext:RecordField>
<ext:RecordField Name="H7">
</ext:RecordField>
<ext:RecordField Name="H8">
</ext:RecordField>
<ext:RecordField Name="H9">
</ext:RecordField>
<ext:RecordField Name="H10">
</ext:RecordField>
<ext:RecordField Name="H11">
</ext:RecordField>
<ext:RecordField Name="H12">
</ext:RecordField>
<ext:RecordField Name="H13">
</ext:RecordField>
<ext:RecordField Name="H14">
</ext:RecordField>
<ext:RecordField Name="H15">
</ext:RecordField>
<ext:RecordField Name="H16">
</ext:RecordField>
<ext:RecordField Name="H17">
</ext:RecordField>
<ext:RecordField Name="H18">
</ext:RecordField>
<ext:RecordField Name="H19">
</ext:RecordField>
<ext:RecordField Name="H20">
</ext:RecordField>
<ext:RecordField Name="H21">
</ext:RecordField>
<ext:RecordField Name="H22">
</ext:RecordField>
<ext:RecordField Name="H23">
</ext:RecordField>
<ext:RecordField Name="H24">
</ext:RecordField>
<ext:RecordField Name="SumValue">
</ext:RecordField>
<ext:RecordField Name="Counter">
</ext:RecordField>
<ext:RecordField Name="InternalUse">
</ext:RecordField>
<ext:RecordField Name="PeakValue">
</ext:RecordField>
<ext:RecordField Name="Vacation">
</ext:RecordField>
<ext:RecordField Name="SumFlag">
</ext:RecordField>
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
</Store>
<View>
<ext:GridView ID="GridView1" runat="server">
<GetRowClass Fn="getRowClass" />
</ext:GridView>
</View>
<TopBar>
<ext:Toolbar ID="Toolbar1" runat="server">
<Items>
<ext:ToolbarFill ID="ToolbarFill1" runat="server" />
</Items>
</ext:Toolbar>
</TopBar>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" />
</SelectionModel>
<ColumnModel>
<Columns>
<ext:Column Align="Center" Sortable="true" DataIndex="MDate" Header="Date" Width="80"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="DayName" Header="Weeks Day"
Width="70" Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="DayOfYear" Header="Years Day"
Width="70" Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="UnitCode" Header="Unit" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H1" Header="H1" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H2" Header="H2" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H3" Header="H3" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H4" Header="H4" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H5" Header="H5" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H6" Header="H6" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H7" Header="H7" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H8" Header="H8" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H9" Header="H9" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H10" Header="H10" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H11" Header="H11" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H12" Header="H12" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H13" Header="H13" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H14" Header="H14" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H15" Header="H15" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H16" Header="H16" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H17" Header="H17" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H18" Header="H18" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H19" Header="H19" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H20" Header="H20" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H21" Header="H21" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H22" Header="H22" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H23" Header="H23" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="H24" Header="H24" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="SumValue" Header="Sum" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="Counter" Header="Counter" Width="50"
Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="InternalUse" Header="Internal Use"
Width="50" Locked="true">
</ext:Column>
<ext:Column Align="Center" Sortable="true" DataIndex="PeakValue" Header="Peek" Width="50"
Locked="true">
</ext:Column>
</Columns>
</ColumnModel>
<LoadMask ShowMask="true" />
</ext:GridPanel>
</Items>
</ext:Panel>
【问题讨论】：
您能提供更多有关案例或示例的信息吗？ 我想上面的图片说明了一切。如果您想了解红色行，它只是某种 StripeRow，我用它来澄清我的问题。 Pars.Engineer，对不起，图片只是显示问题的存在，但我需要代码示例来重现问题。你能显示你有这个问题的标记吗？ Daulet Urazalinov：非常感谢。我添加了标记代码。如果您需要更多信息，请告诉我。 【参考方案1】：我认为最后一列 MDate 有问题，因为您设置了它的下一个属性：Hidden="true" Hideable="false" 并使该列自动展开。
【讨论】：
亲爱的 Daulet Urazalinov， 非常感谢。我的问题解决了。但我真的不知道我的问题得到 -2 的原因是什么 :(以上是关于渲染 Grid 面板 Ext.Net 的最后一列的主要内容，如果未能解决你的问题，请参考以下文章