I have read most, if not all, of the posts on this subject, but none of them correct my issue.
I have a grid with frozen columns and, when I use the horizontal scroll bar, scolling to the right does not bring all of the columns into view. If I remove the frozen columns, it works just fine.
The page is defined (in part) as:
I have a grid with frozen columns and, when I use the horizontal scroll bar, scolling to the right does not bring all of the columns into view. If I remove the frozen columns, it works just fine.
- All columns have a defined width.
- I am using static headers.
- I have tried setting the width to a value rather than letting it default to 100%.
The page is defined (in part) as:
<div id="FormWrapper" style="width: 95%; height: 95%; margin: 0px auto">
<form id="DeviceStatusForm" runat="server"> <asp:Panel ID="Panel1" runat="server" CssClass="RaisedPanel"><div id="ContentDiv" class="Content"> <div id="ReportGridDiv">
<telerik:RadGrid ID="ReportGrid" runat="server" AllowPaging="True" AllowSorting="True" PagerStyle-AlwaysVisible="true" PageSize="50" GridLines="None" DataSourceID="GridDataSource" GroupingEnabled="False" AutoGenerateColumns="False"> <ClientSettings EnableRowHoverStyle="true"> <Selecting AllowRowSelect="False" /> <ClientEvents OnRowContextMenu="ReportGrid_OnRowContextMenu" /> <Scrolling AllowScroll="True" UseStaticHeaders="True" FrozenColumnsCount="1" ScrollHeight="20em" /> <Resizing AllowColumnResize="True" AllowResizeToFit="True" EnableRealTimeResize="False" ResizeGridOnColumnResize="False" ShowRowIndicatorColumn="False" /> </ClientSettings> <AlternatingItemStyle CssClass="rgCommandRow" /> <MasterTableView DataSourceID="GridDataSource" DataKeyNames="AssetId,MacId" ClientDataKeyNames="AssetId, MacId, ReportDate, StatusId" TableLayout="Fixed" CommandItemDisplay="Top" PageSize="10" HorizontalAlign="NotSet"> <CommandItemSettings ShowAddNewRecordButton="False"></CommandItemSettings> <PagerStyle AlwaysVisible="True" /></MasterTableView> <PagerStyle AlwaysVisible="True" /> </telerik:RadGrid> </div> </div>
</asp:Panel>
</form> </div>
The styles used are:
.RaisedPanel
{
margin-top: 20px;
margin-bottom: 30px;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
border-radius: 12px;
-moz-box-shadow: 4px 4px 14px #000;
-webkit-box-shadow: 4px 4px 14px #000;
box-shadow: 4px 4px 14px #000;
padding-left: 2em;
padding-bottom: 1em;
padding-right: 2em;
padding-top: 1em;
}
div.Content
{
height: 100%;
width: 100%;
}
I would appreciate any insights.
2 Answers, 1 is accepted
0

David
Top achievements
Rank 1
answered on 28 Jan 2013, 07:11 PM
Ed, I feel your pain. Both of my applications that use RadGrid have about 50 columns each and using FrozenColumns destroys the user experience scrolling horizontally. For my most recent application, I created a workaround that uses 2 grids side to side. It's not perfect, but it's better than just one grid (at least in my opinion). Both grids use the same datasource but show different columns. I put all the frozen columns in the left grid and the non frozen columns in the right grid. I also enclosed both of these grids inside a RadSplitter and two RadPanes. I set the left side RadPane to a fixed width of 535px (in my case that's what my 5 frozen columns needed) and the right side RadPane uses up the rest of the browser width, this is what the user scrolls. The end result is that neither grid needs to technically have FrozenColumns enabled. Thus you don't have the scrolling difficulties. I've attached a picture so you can see the end result which I think looks great. Horizontal scrolling is now lightning fast on the right side grid.
In order to get this to work, you need to have extra script so if you scroll vertically BOTH grids scroll at the same time. Otherwise the rows in both grids will be off and it will confuse the user. To do this, I found another post and that code worked perfect. The user can now grab either scrollbar (left grid or the right grid), drag it up and down and both grids stay in sync. At the very bottom is the RadCodeBlock, that attaches the scroll bars to both grids and syncs them together. For the left grid I put the scrollbar on the left side (instead of the traditional right side of a grid), it looks nicer that way. If you don't, your left side grid has a scrollbar stuck next to the beginning of the right grid. To do this, it's just a style (direction: rtl):
Here is my main code, you can ignore everything inside both of the MasterTableViews as they're not relevant to getting the "side by side" grids to work.
In order to get this to work, you need to have extra script so if you scroll vertically BOTH grids scroll at the same time. Otherwise the rows in both grids will be off and it will confuse the user. To do this, I found another post and that code worked perfect. The user can now grab either scrollbar (left grid or the right grid), drag it up and down and both grids stay in sync. At the very bottom is the RadCodeBlock, that attaches the scroll bars to both grids and syncs them together. For the left grid I put the scrollbar on the left side (instead of the traditional right side of a grid), it looks nicer that way. If you don't, your left side grid has a scrollbar stuck next to the beginning of the right grid. To do this, it's just a style (direction: rtl):
html,
body,
form
{
margin
:
2px
;
padding
:
1px
;
height
:
99%
;
}
.PipelineGridLeft
{
direction
:
rtl
;
}
.PipelineGridLeft table
{
direction
:
ltr
;
}
Here is my main code, you can ignore everything inside both of the MasterTableViews as they're not relevant to getting the "side by side" grids to work.
<
telerik:RadSplitter
id
=
"RadSplitter1"
runat
=
"server"
width
=
"100%"
Height
=
"98%"
Orientation
=
"Vertical"
>
<
telerik:RadPane
id
=
"RadPaneLeftGrid"
runat
=
"server"
minwidth
=
"100"
width
=
"535"
Scrolling
=
"None"
>
<
telerik:RadGrid
ID
=
"RadGridLeft_Pipeline"
runat
=
"server"
DataSourceID
=
"sqlds_PipelineData"
GridLines
=
"Both"
EnableLinqExpressions
=
"false"
ShowFooter
=
"True"
CssClass
=
"PipelineGridLeft"
Height
=
"100%"
OnItemDataBound
=
"RadGridLeft_Pipeline_ItemDataBound"
OnColumnCreated
=
"RadGridLeft_Pipeline_ColumnCreated"
OnItemCreated
=
"RadGridLeft_Pipeline_ItemCreated"
OnBiffExporting
=
"RadGrid1_BiffExporting"
AutoGenerateColumns
=
"False"
>
<
ExportSettings
ExportOnlyData
=
"false"
FileName
=
"PipelineGrid"
OpenInNewWindow
=
"True"
IgnorePaging
=
"true"
>
<
Excel
Format
=
"Biff"
></
Excel
>
</
ExportSettings
>
<
ClientSettings
EnableRowHoverStyle
=
"true"
>
<
Scrolling
AllowScroll
=
"true"
UseStaticHeaders
=
"true"
/>
<
Resizing
AllowColumnResize
=
"true"
/>
<%--<
Selecting
AllowRowSelect
=
"true"
></
Selecting
>--%>
</
ClientSettings
>
<
SelectedItemStyle
CssClass
=
"SelectedItem"
></
SelectedItemStyle
>
<
MasterTableView
ShowGroupFooter
=
"true"
DataKeyNames
=
"requirement_id"
AllowMultiColumnSorting
=
"false"
Font-Size
=
"8pt"
TableLayout
=
"Fixed"
CommandItemDisplay
=
"Top"
>
<
CommandItemSettings
ShowExportToExcelButton
=
"true"
ShowAddNewRecordButton
=
"false"
ShowRefreshButton
=
"false"
/>
<
ItemStyle
CssClass
=
"RowShort"
Wrap
=
"false"
/>
<
AlternatingItemStyle
CssClass
=
"RowShort"
Wrap
=
"false"
/>
<
GroupHeaderItemStyle
CssClass
=
"GroupHeader"
/>
<
RowIndicatorColumn
>
<
HeaderStyle
Width
=
"20px"
></
HeaderStyle
>
<
ItemStyle
Width
=
"20px"
/>
</
RowIndicatorColumn
>
<
GroupByExpressions
>
<
telerik:GridGroupByExpression
>
<
SelectFields
>
<
telerik:GridGroupByField
HeaderText
=
"Phase: "
FieldName
=
"phase_name"
></
telerik:GridGroupByField
>
</
SelectFields
>
<
GroupByFields
>
<
telerik:GridGroupByField
FieldName
=
"Project_Status_Id"
SortOrder
=
"Descending"
></
telerik:GridGroupByField
>
</
GroupByFields
>
</
telerik:GridGroupByExpression
>
</
GroupByExpressions
>
<
ColumnGroups
>
<
telerik:GridColumnGroup
HeaderText
=
"Prob %"
Name
=
"Prob%"
HeaderStyle-HorizontalAlign
=
"Center"
>
</
telerik:GridColumnGroup
>
</
ColumnGroups
>
<
Columns
>
<
telerik:GridBoundColumn
DataField
=
"reqIdentity"
HeaderText
=
"RP ID"
ReadOnly
=
"True"
UniqueName
=
"reqIdentity"
>
<
HeaderStyle
Width
=
"50px"
/>
<
ItemStyle
Width
=
"50px"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"client_project_name"
HeaderText
=
"Account"
UniqueName
=
"client_project_name"
>
<
HeaderStyle
Width
=
"200px"
/>
<
ItemStyle
Width
=
"200px"
Wrap
=
"false"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"geography_name"
UniqueName
=
"geography_name"
HeaderText
=
"Geography"
>
<
HeaderStyle
Width
=
"120px"
/>
<
ItemStyle
Width
=
"120px"
Wrap
=
"false"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"AE_lastname"
UniqueName
=
"AE_lastname"
HeaderText
=
"AE"
>
<
HeaderStyle
Width
=
"90px"
/>
<
ItemStyle
Width
=
"90px"
Wrap
=
"false"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridNumericColumn
DataField
=
"probability_of_closure"
UniqueName
=
"probability_of_closure"
HeaderText
=
""
ColumnGroupName
=
"Prob%"
DataFormatString
=
"{0:P0}"
>
<
HeaderStyle
Width
=
"60px"
/>
<
ItemStyle
Width
=
"60px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridBoundColumn
DataField
=
"filter"
UniqueName
=
"filter"
HeaderText
=
""
Display
=
"False"
>
<
HeaderStyle
Width
=
"0px"
/>
<
ItemStyle
Width
=
"0px"
Wrap
=
"false"
/>
</
telerik:GridBoundColumn
>
</
Columns
>
</
MasterTableView
>
</
telerik:RadGrid
>
</
telerik:RadPane
>
<
telerik:RadSplitBar
id
=
"RadSplitbar1"
runat
=
"server"
EnableResize
=
"false"
Visible
=
"false"
></
telerik:RadSplitBar
>
<
telerik:RadPane
id
=
"RadPaneRight"
runat
=
"server"
Scrolling
=
"None"
>
<
telerik:RadGrid
ID
=
"RadGridRight_Pipeline"
runat
=
"server"
DataSourceID
=
"sqlds_PipelineData"
GridLines
=
"Both"
EnableLinqExpressions
=
"false"
ShowFooter
=
"True"
CssClass
=
"PipelineGridRight"
Height
=
"100%"
OnItemDataBound
=
"RadGridRight_Pipeline_ItemDataBound"
OnColumnCreated
=
"RadGridRight_Pipeline_ColumnCreated"
OnItemCreated
=
"RadGridRight_Pipeline_ItemCreated"
OnExcelExportCellFormatting
=
"RadGridRight_ExcelExportCellFormatting"
OnItemCommand
=
"RadGridRight_Pipeline_ItemCommand"
AutoGenerateColumns
=
"False"
>
<
ExportSettings
ExportOnlyData
=
"true"
FileName
=
"PipelineGrid"
OpenInNewWindow
=
"True"
IgnorePaging
=
"true"
>
<
Excel
Format
=
"Html"
></
Excel
>
</
ExportSettings
>
<
ClientSettings
EnableRowHoverStyle
=
"true"
>
<
ClientEvents
OnColumnCreated
=
"ColumnCreated"
/>
<
Scrolling
AllowScroll
=
"true"
UseStaticHeaders
=
"true"
/>
</
ClientSettings
>
<
SelectedItemStyle
CssClass
=
"SelectedItem"
></
SelectedItemStyle
>
<
MasterTableView
ShowGroupFooter
=
"true"
DataKeyNames
=
"requirement_id,groupNumber"
AllowMultiColumnSorting
=
"false"
Font-Size
=
"8pt"
TableLayout
=
"Fixed"
CommandItemDisplay
=
"Top"
>
<
CommandItemSettings
ShowExportToExcelButton
=
"true"
ShowAddNewRecordButton
=
"false"
ShowRefreshButton
=
"false"
/>
<
ItemStyle
CssClass
=
"RowShort"
Wrap
=
"false"
/>
<
AlternatingItemStyle
CssClass
=
"RowShort"
Wrap
=
"false"
/>
<
RowIndicatorColumn
>
<
HeaderStyle
Width
=
"20px"
></
HeaderStyle
>
<
ItemStyle
Width
=
"20px"
/>
</
RowIndicatorColumn
>
<
GroupByExpressions
>
<
telerik:GridGroupByExpression
>
<
SelectFields
>
<
telerik:GridGroupByField
HeaderText
=
"Phase: "
FieldName
=
"phase_name"
></
telerik:GridGroupByField
>
</
SelectFields
>
<
GroupByFields
>
<
telerik:GridGroupByField
FieldName
=
"Project_Status_Id"
SortOrder
=
"Descending"
></
telerik:GridGroupByField
>
</
GroupByFields
>
</
telerik:GridGroupByExpression
>
</
GroupByExpressions
>
<
ColumnGroups
>
<
telerik:GridColumnGroup
HeaderText
=
"# of people billing each month"
Name
=
"PeopleBilling"
HeaderStyle-HorizontalAlign
=
"Center"
>
</
telerik:GridColumnGroup
>
<
telerik:GridColumnGroup
HeaderText
=
"Project Hours"
Name
=
"ProjectHours"
HeaderStyle-HorizontalAlign
=
"Center"
>
</
telerik:GridColumnGroup
>
<
telerik:GridColumnGroup
HeaderText
=
"Project Magnitude"
Name
=
"ProjectMagnitude"
HeaderStyle-HorizontalAlign
=
"Center"
>
</
telerik:GridColumnGroup
>
<
telerik:GridColumnGroup
HeaderText
=
"Discounted Revenue"
Name
=
"DiscountedRevenue"
HeaderStyle-HorizontalAlign
=
"Center"
>
</
telerik:GridColumnGroup
>
<
telerik:GridColumnGroup
HeaderText
=
"Discounted Bill Rate"
Name
=
"DiscountedBillRate"
HeaderStyle-HorizontalAlign
=
"Center"
>
</
telerik:GridColumnGroup
>
<
telerik:GridColumnGroup
HeaderText
=
"Discounted Headcount"
Name
=
"DiscountedHeadcount"
HeaderStyle-HorizontalAlign
=
"Center"
>
</
telerik:GridColumnGroup
>
<
telerik:GridColumnGroup
HeaderText
=
"Flat Percentage"
Name
=
"FlatPercentage"
HeaderStyle-HorizontalAlign
=
"Center"
>
</
telerik:GridColumnGroup
>
</
ColumnGroups
>
<
Columns
>
<%-- <
telerik:GridBoundColumn
DataField
=
"requirement_id"
FilterControlAltText
=
"Filter requirement_id column"
HeaderText
=
"requirement_id"
UniqueName
=
"requirement_id"
Display
=
"False"
ReadOnly
=
"True"
>
<
HeaderStyle
Width
=
"0px"
/>
<
ItemStyle
Width
=
"0px"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridNumericColumn
DataField
=
"Client_Id"
DecimalDigits
=
"2"
FilterControlAltText
=
"Filter Client_Id column"
HeaderText
=
"ClientId"
UniqueName
=
"Client_Id"
Display
=
"False"
ReadOnly
=
"True"
>
<
HeaderStyle
Width
=
"0px"
/>
<
ItemStyle
Width
=
"0px"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
DataField
=
"Project_Id"
DecimalDigits
=
"2"
FilterControlAltText
=
"Filter Project_Id column"
HeaderText
=
"PrjId"
UniqueName
=
"Project_Id"
Display
=
"False"
ReadOnly
=
"True"
>
<
HeaderStyle
Width
=
"0px"
/>
<
ItemStyle
Width
=
"0px"
/>
</
telerik:GridNumericColumn
>--%>
<
telerik:GridBoundColumn
DataField
=
"client_project_name"
HeaderText
=
"Account"
UniqueName
=
"client_project_name"
Display
=
"False"
>
<
HeaderStyle
Width
=
"200px"
/>
<
ItemStyle
Width
=
"200px"
Wrap
=
"false"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"reqIdentity"
HeaderText
=
"RP ID"
ReadOnly
=
"True"
Display
=
"False"
UniqueName
=
"reqIdentity"
>
<
HeaderStyle
Width
=
"50px"
/>
<
ItemStyle
Width
=
"50px"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"geography_name"
UniqueName
=
"geography_name"
HeaderText
=
"Geography"
Display
=
"False"
>
<
HeaderStyle
Width
=
"120px"
/>
<
ItemStyle
Width
=
"120px"
Wrap
=
"false"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"AE_lastname"
UniqueName
=
"AE_lastname"
HeaderText
=
"AE"
Display
=
"False"
>
<
HeaderStyle
Width
=
"90px"
/>
<
ItemStyle
Width
=
"90px"
Wrap
=
"false"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridNumericColumn
DataField
=
"probability_of_closure"
UniqueName
=
"probability_of_closure"
HeaderText
=
"Prob %"
Display
=
"False"
DataFormatString
=
"{0:P0}"
>
<
HeaderStyle
Width
=
"60px"
/>
<
ItemStyle
Width
=
"60px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridBoundColumn
DataField
=
"location"
FilterControlAltText
=
"Filter location column"
HeaderText
=
"Location"
UniqueName
=
"location"
AutoPostBackOnFilter
=
"True"
CurrentFilterFunction
=
"StartsWith"
SortExpression
=
"location"
>
<
HeaderStyle
Width
=
"120"
/>
<
ItemStyle
Width
=
"120px"
Wrap
=
"false"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"Offering"
HeaderText
=
"Offering"
ReadOnly
=
"True"
UniqueName
=
"Offering"
>
<
HeaderStyle
Width
=
"150"
/>
<
ItemStyle
Width
=
"150px"
Wrap
=
"false"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"division_name"
UniqueName
=
"division_name"
HeaderText
=
"Div"
>
<
HeaderStyle
Width
=
"40px"
/>
<
ItemStyle
Width
=
"40px"
Wrap
=
"false"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridNumericColumn
DataField
=
"bill_rate"
UniqueName
=
"bill_rate"
HeaderText
=
"Bill Rate"
DataFormatString
=
"{0:C}"
>
<
HeaderStyle
Width
=
"50px"
/>
<
ItemStyle
Width
=
"50px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"PeopleBilling"
DataField
=
"people_billing_month1"
UniqueName
=
"people_billing_month1"
DataFormatString
=
"{0:F}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnGreenLeftBorder"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"PeopleBilling"
DataField
=
"people_billing_month2"
UniqueName
=
"people_billing_month2"
DataFormatString
=
"{0:F}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"PeopleBilling"
DataField
=
"people_billing_month3"
UniqueName
=
"people_billing_month3"
DataFormatString
=
"{0:F}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"PeopleBilling"
DataField
=
"people_billing_month4"
UniqueName
=
"people_billing_month4"
DataFormatString
=
"{0:F}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"PeopleBilling"
DataField
=
"people_billing_month5"
UniqueName
=
"people_billing_month5"
DataFormatString
=
"{0:F}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"PeopleBilling"
DataField
=
"people_billing_month6"
UniqueName
=
"people_billing_month6"
DataFormatString
=
"{0:F}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"ProjectHours"
DataField
=
"project_hours_month1"
UniqueName
=
"project_hours_month1"
DataFormatString
=
"{0:F}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnGreenLeftBorder"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"ProjectHours"
DataField
=
"project_hours_month2"
UniqueName
=
"project_hours_month2"
DataFormatString
=
"{0:F}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"ProjectHours"
DataField
=
"project_hours_month3"
UniqueName
=
"project_hours_month3"
DataFormatString
=
"{0:F}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"ProjectHours"
DataField
=
"project_hours_month4"
UniqueName
=
"project_hours_month4"
DataFormatString
=
"{0:F}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"ProjectHours"
DataField
=
"project_hours_month5"
UniqueName
=
"project_hours_month5"
DataFormatString
=
"{0:F}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"ProjectHours"
DataField
=
"project_hours_month6"
UniqueName
=
"project_hours_month6"
DataFormatString
=
"{0:F}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"ProjectMagnitude"
DataField
=
"undiscounted_revenue_month1"
UniqueName
=
"undiscounted_revenue_month1"
DataFormatString
=
"${0:#,0}"
>
<
HeaderStyle
Width
=
"65px"
/>
<
ItemStyle
Width
=
"65px"
Wrap
=
"false"
CssClass
=
"ColumnGreenLeftBorder"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"ProjectMagnitude"
DataField
=
"undiscounted_revenue_month2"
UniqueName
=
"undiscounted_revenue_month2"
DataFormatString
=
"${0:#,0}"
>
<
HeaderStyle
Width
=
"65px"
/>
<
ItemStyle
Width
=
"65px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"ProjectMagnitude"
DataField
=
"undiscounted_revenue_month3"
UniqueName
=
"undiscounted_revenue_month3"
DataFormatString
=
"${0:#,0}"
>
<
HeaderStyle
Width
=
"65px"
/>
<
ItemStyle
Width
=
"65px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"ProjectMagnitude"
DataField
=
"undiscounted_revenue_month4"
UniqueName
=
"undiscounted_revenue_month4"
DataFormatString
=
"${0:#,0}"
>
<
HeaderStyle
Width
=
"65px"
/>
<
ItemStyle
Width
=
"65px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"ProjectMagnitude"
DataField
=
"undiscounted_revenue_month5"
UniqueName
=
"undiscounted_revenue_month5"
DataFormatString
=
"${0:#,0}"
>
<
HeaderStyle
Width
=
"65px"
/>
<
ItemStyle
Width
=
"65px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"ProjectMagnitude"
DataField
=
"undiscounted_revenue_month6"
UniqueName
=
"undiscounted_revenue_month6"
DataFormatString
=
"${0:#,0}"
>
<
HeaderStyle
Width
=
"65px"
/>
<
ItemStyle
Width
=
"65px"
Wrap
=
"false"
CssClass
=
"ColumnGreen"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedRevenue"
DataField
=
"discounted_revenue_month1"
UniqueName
=
"discounted_revenue_month1"
DataFormatString
=
"${0:#,0}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"80px"
/>
<
ItemStyle
Width
=
"80px"
Wrap
=
"false"
CssClass
=
"ColumnWhiteLeftBorder"
/>
<
FooterStyle
Width
=
"80px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedRevenue"
DataField
=
"discounted_revenue_month2"
UniqueName
=
"discounted_revenue_month2"
DataFormatString
=
"${0:#,0}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"80px"
/>
<
ItemStyle
Width
=
"80px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"80px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedRevenue"
DataField
=
"discounted_revenue_month3"
UniqueName
=
"discounted_revenue_month3"
DataFormatString
=
"${0:#,0}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"80px"
/>
<
ItemStyle
Width
=
"80px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"80px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedRevenue"
DataField
=
"discounted_revenue_month4"
UniqueName
=
"discounted_revenue_month4"
DataFormatString
=
"${0:#,0}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"80px"
/>
<
ItemStyle
Width
=
"80px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"80px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedRevenue"
DataField
=
"discounted_revenue_month5"
UniqueName
=
"discounted_revenue_month5"
DataFormatString
=
"${0:#,0}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"80px"
/>
<
ItemStyle
Width
=
"80px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"80px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedRevenue"
DataField
=
"discounted_revenue_month6"
UniqueName
=
"discounted_revenue_month6"
DataFormatString
=
"${0:#,0}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"80px"
/>
<
ItemStyle
Width
=
"80px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"80px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridCalculatedColumn
ColumnGroupName
=
"DiscountedRevenue"
HeaderText
=
"6 month total"
UniqueName
=
"discounted_revenue_6monthTotal"
DataType
=
"System.Decimal"
DataFields
=
"discounted_revenue_month1, discounted_revenue_month2, discounted_revenue_month3, discounted_revenue_month4, discounted_revenue_month5, discounted_revenue_month6"
Expression
=
"{0}+{1}+{2}+{3}+{4}+{5}"
DataFormatString
=
"${0:#,0}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"100px"
/>
<
ItemStyle
Width
=
"100px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"100px"
Wrap
=
"false"
/>
</
telerik:GridCalculatedColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedBillRate"
DataField
=
"discounted_billrate_month1"
UniqueName
=
"discounted_billrate_month1"
DataFormatString
=
"{0:C}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnWhiteLeftBorder"
/>
<
FooterStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedBillRate"
DataField
=
"discounted_billrate_month2"
UniqueName
=
"discounted_billrate_month2"
DataFormatString
=
"{0:C}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedBillRate"
DataField
=
"discounted_billrate_month3"
UniqueName
=
"discounted_billrate_month3"
DataFormatString
=
"{0:C}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedBillRate"
DataField
=
"discounted_billrate_month4"
UniqueName
=
"discounted_billrate_month4"
DataFormatString
=
"{0:C}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedBillRate"
DataField
=
"discounted_billrate_month5"
UniqueName
=
"discounted_billrate_month5"
DataFormatString
=
"{0:C}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedBillRate"
DataField
=
"discounted_billrate_month6"
UniqueName
=
"discounted_billrate_month6"
DataFormatString
=
"{0:C}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedHeadcount"
DataField
=
"discounted_headcount_month1"
UniqueName
=
"discounted_headcount_month1"
DataFormatString
=
"{0:#,0}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
CssClass
=
"ColumnWhiteLeftBorder"
/>
<
FooterStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedHeadcount"
DataField
=
"discounted_headcount_month2"
UniqueName
=
"discounted_headcount_month2"
DataFormatString
=
"{0:#,0}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedHeadcount"
DataField
=
"discounted_headcount_month3"
UniqueName
=
"discounted_headcount_month3"
DataFormatString
=
"{0:#,0}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedHeadcount"
DataField
=
"discounted_headcount_month4"
UniqueName
=
"discounted_headcount_month4"
DataFormatString
=
"{0:#,0}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedHeadcount"
DataField
=
"discounted_headcount_month5"
UniqueName
=
"discounted_headcount_month5"
DataFormatString
=
"{0:#,0}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"DiscountedHeadcount"
DataField
=
"discounted_headcount_month6"
UniqueName
=
"discounted_headcount_month6"
DataFormatString
=
"{0:#,0}"
Aggregate
=
"Sum"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
<
FooterStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridBoundColumn
DataField
=
"product_line"
HeaderText
=
"Product Line"
UniqueName
=
"product_line"
>
<
HeaderStyle
Width
=
"80px"
/>
<
ItemStyle
Width
=
"80px"
Wrap
=
"false"
CssClass
=
"ColumnWhiteLeftBorder"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"revenue_type_desc"
HeaderText
=
"Revenue Type"
UniqueName
=
"revenue_type_desc"
>
<
HeaderStyle
Width
=
"80px"
/>
<
ItemStyle
Width
=
"80px"
Wrap
=
"false"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridNumericColumn
DataField
=
"FlatRevenue"
UniqueName
=
"FlatRevenue"
HeaderText
=
"Flat $"
DataFormatString
=
"{0:C}"
>
<
HeaderStyle
Width
=
"80px"
/>
<
ItemStyle
Width
=
"80px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
DataField
=
"FlatPercentageOver6Months"
UniqueName
=
"FlatPercentageOver6Months"
HeaderText
=
"% of flat over these 6 months"
DataFormatString
=
"{0:P2}"
>
<
HeaderStyle
Width
=
"160px"
/>
<
ItemStyle
Width
=
"160px"
Wrap
=
"false"
HorizontalAlign
=
"Center"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"FlatPercentage"
DataField
=
"flat_percentage_month1"
UniqueName
=
"flat_percentage_month1"
DataFormatString
=
"{0:P2}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"FlatPercentage"
DataField
=
"flat_percentage_month2"
UniqueName
=
"flat_percentage_month2"
DataFormatString
=
"{0:P2}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"FlatPercentage"
DataField
=
"flat_percentage_month3"
UniqueName
=
"flat_percentage_month3"
DataFormatString
=
"{0:P2}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"FlatPercentage"
DataField
=
"flat_percentage_month4"
UniqueName
=
"flat_percentage_month4"
DataFormatString
=
"{0:P2}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"FlatPercentage"
DataField
=
"flat_percentage_month5"
UniqueName
=
"flat_percentage_month5"
DataFormatString
=
"{0:P2}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridNumericColumn
ColumnGroupName
=
"FlatPercentage"
DataField
=
"flat_percentage_month6"
UniqueName
=
"flat_percentage_month6"
DataFormatString
=
"{0:P2}"
>
<
HeaderStyle
Width
=
"55px"
/>
<
ItemStyle
Width
=
"55px"
Wrap
=
"false"
/>
</
telerik:GridNumericColumn
>
<
telerik:GridBoundColumn
DataField
=
"staffing_type"
HeaderText
=
"Staffing Type"
UniqueName
=
"staffing_type"
>
<
HeaderStyle
Width
=
"80px"
/>
<
ItemStyle
Width
=
"80px"
Wrap
=
"false"
CssClass
=
"ColumnWhiteLeftBorder"
/>
</
telerik:GridBoundColumn
>
</
Columns
>
</
MasterTableView
>
</
telerik:RadGrid
>
</
telerik:RadPane
>
</
telerik:RadSplitter
>
<
telerik:RadCodeBlock
ID
=
"RadCodeBlock1"
runat
=
"server"
>
<
script
type
=
"text/javascript"
>
Sys.Application.add_load(attachScrollHandlers);
var RadGrid1;
var RadGrid2;
function attachScrollHandlers() {
RadGrid1 = $find("<%= RadGridLeft_Pipeline.ClientID %>");
RadGrid2 = $find("<%= RadGridRight_Pipeline.ClientID %>");
$addHandler(RadGrid1.GridDataDiv, "scroll", sync12);
$addHandler(RadGrid2.GridDataDiv, "scroll", sync21);
}
function sync12(e) {
RadGrid2.GridDataDiv.scrollTop = RadGrid1.GridDataDiv.scrollTop;
}
function sync21(e) {
RadGrid1.GridDataDiv.scrollTop = RadGrid2.GridDataDiv.scrollTop;
}
;
</
script
>
</
telerik:RadCodeBlock
>
0

Ed
Top achievements
Rank 1
answered on 28 Jan 2013, 07:37 PM
David,
Thanks for the post. You have obviously spent a good deal of time resolving this. I may give it a try.
One point: these issues do not arise when the grid is in RadWindow. Of course, there I have a rigidly-sized page.
Ed
Thanks for the post. You have obviously spent a good deal of time resolving this. I may give it a try.
One point: these issues do not arise when the grid is in RadWindow. Of course, there I have a rigidly-sized page.
Ed