This is a migrated thread and some comments may be shown as answers.

Radgrid static header problem

1 Answer 94 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Satyajit asked on 07 Mar 2012, 02:51 PM

Hi,
I am using radgrid with static header,but it gives me problem when web page resizing.
Radgrid width has not adjusted according to page size.When page has refreshed then only width has adjusted

Below are the code,

@ Page Language="C#" AutoEventWireup="true" CodeFile="frmIRPage.aspx.cs" Inherits="Dummy"%>

@ Register TagPrefix="Acme" Namespace="Acme" Assembly="App_Web_mytestuc.ascx.cdcab7d2" %>

@ Register Assembly="ContainerControl" Namespace="Tittle.Controls" TagPrefix="Tittle" %>

@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

html xmlns="http://www.w3.org/1999/xhtml">

head runat="server">

-- <script src="Javascript/TableHeightWidth.js" type="text/javascript"></script>--%>

function () {

"#accordion").accordion({

collapsible:

true

});

</script>

.style1

{

width: 47%;

}

.RadPanelBar .rpImage

{

height: 19px;

}

.RadPanelBar .rpLevel1 .rpImage

{

height: 16px;

}

</style>

function funSetWidthHeight(id, id2, id3, idV,Img4, iWidth, iHeight) {

// debugger;

var myWidth = 0;

var myHeight = 0;

if (typeof (window.innerWidth) == 'number') {

//Non-IE

myWidth = window.innerWidth;

myHeight = window.innerHeight;

}

if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {

//IE 6+ in 'standards compliant mode'

myWidth = document.documentElement.clientWidth;

myHeight = document.documentElement.clientHeight;

}

else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {

//IE 4 compatible

myWidth = document.body.clientWidth;

myHeight = document.body.clientHeight;

}

if (myWidth != 0) {

myWidth = document.documentElement.clientWidth;

myHeight = document.documentElement.clientHeight;

}

if (myWidth != 0) {

var vWidth = myWidth - iWidth;

var vHeight = myHeight - iHeight;

if (vWidth < 150)

vWidth = 150;

if (vHeight < 165)

vHeight = 165;

document.getElementById(id).style.width = vWidth +

'px';

document.getElementById(id2).style.width = vWidth +

'px';

document.getElementById(id3).style.width = vWidth +

'px';

document.getElementById(idV).style.width = vWidth +

'px';

document.getElementById(Img4).style.width = vWidth +

'px';

}

</script>

head>

body onload="funSetWidthHeight('div1', 'tb1', 'tb2', 'tb3','Img4', 20, 20);">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server" />

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

<!--

function HandleScrolling(e) {

var grid = $find("<%=RadGrid2.ClientID %>");

var scrollArea = document.getElementById("<%= RadGrid2.ClientID %>" + "_GridData");

if (IsScrolledToBottom(scrollArea)) {

var currentlyDisplayedRecords = grid.get_masterTableView().get_pageSize() * (grid.get_masterTableView().get_currentPageIndex() + 1);

//if the presently visible items are less than the entire source records count

//trigger an ajax request to increase them

if (currentlyDisplayedRecords < 100) {

$find(

"<%= RadAjaxManager1.ClientID %>").ajaxRequest("LoadMoreRecords");

}

//this method calculates whether you have reached the bottom when dragging the vertical grid scroll

function IsScrolledToBottom(scrollArea) {

var currentPosition = scrollArea.scrollTop + scrollArea.clientHeight;

return currentPosition == scrollArea.scrollHeight;

}

-->

</script>

telerik:RadCodeBlock>

telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">

<telerik:AjaxSetting AjaxControlID="RadAjaxManager1">

<telerik:AjaxUpdatedControl ControlID="RadGrid2" LoadingPanelID="RadAjaxLoadingPanel2" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

telerik:RadAjaxManager>

<tr>

<td align="left" style="width:100%; height: 8%; background-image: url('images/DM-bar.jpg');

background-repeat: repeat-x;vertical-align:top">

</td>

</tr>

</table>

<tr>

<td id="sbCont" style="width: 15%; height: 100%; font-size: 7pt;background-color:White;

color: #000000; vertical-align: top">

<a href="#">Services</a></h3>

<div>

<p>

<asp:HyperLink ID="lnkDocumentManager" runat="server" Font-Underline="false" Text="File Manager" Target="_blank"/>

</p>

</div>

<a href="#">My Reports</a></h3>

<div>

<p>

Reports

</p>

</div>

<a href="#">Historic Models</a></h3>

<div>

<p>

Section 33

</p>

</div>

<a href="#">Manaege Data</a></h3>

<div>

<p>

Section 44

</p>

</div>

<a href="#">View Historic Data</a></h3>

<div>

<p>

Section 44

</p>

</div>

<a href="#">Analyst capture</a></h3>

<div>

<p>

Section 44

</p>

</div>

<a href="#">Feedback</a></h3>

<div>

<p>

Section 44

</p>

</div>

</td>

</tr>

<tbody>

<img alt="" id="Img1" width="30" height="8" onclick="leftRoeHide(this);" src="Images/vertical1_arrow.jpg"

style="cursor: pointer; height: 8px;" />

</td>

</tr>

<tr id="leftRoeHide" style="vertical-align: bottom; background-color: white; font-size: 7pt;

color: #000000;" valign="bottom">

<tbody>

<tr>

<asp:LinkButton ID="lnkUtilities" runat="server" Font-Size="Small" ForeColor="#668fa3" Font-Names="Verdana" Text="Utilities"></asp:LinkButton>

</td>

</tr>

</tbody>

</table>

</td>

</tr>

</tbody>

</table>

</td>

</tr>

</table>

</td>

</td>

<asp:Label ID="Label1" runat="server" Text="Login as " Font-Names="Calibri" Font-Size="Small"></asp:Label> | 

<asp:LinkButton ID="LinkButton1" runat="server" Font-Names="Calibri" Font-Size="Small" CausesValidation="False"

ForeColor="#668fa3">Sign Out</asp:LinkButton>

</td>

</tr>

<td>

<tbody>

<tbody>

<Tittle:PanelCurveControl ID='tblCrvPnl' runat="server" Expandable="true" Margin="10" Title="Approve Historical Details" TabBackColor="#668fa3" HasPrint="false">

<telerik:RadGrid ID="RadGrid2" AllowSorting="True" runat="server" AllowPaging="true"

Width="40%" PageSize="15" GridLines="Both" Skin="MyCustomSkin" EnableEmbeddedSkins="false" >

</ClientSettings>

</telerik:RadGrid>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel2" runat="server">

</telerik:RadAjaxLoadingPanel>

</Tittle:PanelCurveControl>

</td>

</tr>

</td>

</tr>

</td>

</tr>

</tbody>

</table>

</td>

</tr>

</tbody>

</table>

</td>

</tr>

<td style="width: 100%; background-repeat: repeat-x; background-position: center;

background-color: #e7ebf0;" align="center">

<img alt="" id="Img2" width="60" height="10" onclick="MiddleRowHide(this);" src="Images/vertical1_arrow.jpg"

style="cursor: pointer" />

</td>

</tr>

<td style="width: 100%; background-image: url(Images/DM-bar.jpg); background-repeat: repeat-x;

background-position: center; background-color: #e7ebf0;" align="center">

</td>

</tr>

<tr id="MiddleRowHide" style="background-color: white; font-size: 7pt; color: #000000;

vertical-align: bottom; height: 100%" valign="bottom">

<br />

</td>

</tr>

</table>

</td>

</tr>

</table>

</td>

</tr>

</table>

<tr>

<td style="background-image: url('Images/extra bar1.jpg'); background-repeat: repeat;

clip: rect(auto, 25px, auto, auto); height: 15px;">

<tr>

<asp:LinkButton ID="lnkDesclaimer" runat="server" ForeColor="White">Desclaimer</asp:LinkButton>  

</td>

<asp:Label runat="server" ID="lbl1" Text="(Reserved)" ForeColor="White"></asp:Label>

</td>

</td>

<img alt="" src="Images/phone.png" width="10" height="10" /> <asp:Label ID="lblContactUs"

runat="server" ForeColor="White">Contact Us   |</asp:Label>

</td>

<td style="font-family: Calibri; font-size: 15px; padding: 5px; width: 25%" align="left"

class="style1">

<img alt="" src="Images/print.gif" width="10" height="10" /> <asp:Label runat="server"

ID="lblPrint" ForeColor="White" Text="Print"></asp:Label>

</td>

</tr>

</table>

</td>

</tr>

</table>

</div>

</form>

body>

html>

　

Thanks for any help.
Satyajit Kadam

Radgrid static header problem

1 Answer, 1 is accepted