or
<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.<form id="form1" runat="server"> <telerik:RadScriptManager runat="server" ID="RadScriptManager1" /> <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"> <script type="text/javascript"> function RowDblClick(sender, eventArgs) { //alert("Chosen Row ID: " + eventArgs.getDataKeyValue("ID")); } </script> </telerik:RadCodeBlock> <telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="True" Width="97%" CellSpacing="0" GridLines="None" OnSelectedIndexChanged="RadGrid1_SelectedIndexChanged"> <PagerStyle Mode="NumericPages"></PagerStyle> <MasterTableView AutoGenerateColumns="False" DataKeyNames="ID" ClientDataKeyNames="ID" Width="100%" CommandItemDisplay="Top" PageSize="5"> <Columns> <telerik:GridBoundColumn DataField="ID" HeaderText="ID" SortExpression="ID" UniqueName="ID"> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="TesisatNo" HeaderText="Tesisat No" SortExpression="TesisatNo" UniqueName="TesisatNo"> </telerik:GridBoundColumn> </Columns> <EditFormSettings> <EditColumn FilterControlAltText="Filter EditCommandColumn column"> </EditColumn> </EditFormSettings> </MasterTableView> <ClientSettings> <Selecting AllowRowSelect="true"></Selecting> <ClientEvents OnRowDblClick="RowDblClick"></ClientEvents> </ClientSettings> <FilterMenu EnableImageSprites="False"> </FilterMenu> </telerik:RadGrid> <asp:Panel ID="PanelDetails" runat="server" Visible="false"> THIS BECOMES VISIBLE ON DOUBLE CLICK OR ON BUTTON CLICK
ALSO THE SELECTED ROW ID MUST BE RECEIVED HERE </asp:Panel> </form>