radgrid adjust client side height...

2 posts, 0 answers
  1. mark baer
    mark baer avatar
    142 posts
    Member since:
    Sep 2009

    Posted 23 Feb 2012 Link to this post

    Requirements

    RadControls version

     Q1 2012

    .NET version

     4.xxx

    Visual Studio version

     VS 2010

    programming language

     Javascript...

    browser support

    all browsers supported by RadControls


    PROJECT DESCRIPTION                                    
    Trying to change the height of my radgrid based on the client window size...Tried setting grid to 100%, but it's height is 0 while it is loading which looks weird so tried setting height to 600, then after the data is loaded, resizing on the client side to windowHeight-100px...Found old artice on your site from 2009 about grid.get_element().Style.height=xxx, but that code doesn't seem to work anymore...VS 2010 broke at that point...Below is my current Javascript...

    This code gets called from the server after I call DataBind on the Radgrid.  HELP???
    <FONT color="#0000ff" size="2" face="Consolas"><FONT color="#0000ff" size="2"
    face="Consolas"><FONT color="#0000ff" size="2" face="Consolas">
    <P>function</P></FONT>
    <P></P></FONT>
    <P></P></FONT>
    <P><FONT size="2" face="Consolas"><FONT size="2" face="Consolas"> resizeGrid()
    {</FONT></FONT></P><FONT size="2" face="Consolas"><FONT size="2"
    face="Consolas">
    <P> </P></FONT>
    <P></P></FONT>
    <P><FONT color="#0000ff" size="2" face="Consolas"><FONT color="#0000ff" size="2"
    face="Consolas"><FONT color="#0000ff" size="2"
    face="Consolas">var</FONT></FONT></FONT><FONT size="2" face="Consolas"><FONT
    size="2" face="Consolas"> grid = $get(</FONT></FONT><FONT color="#800000" size="2"
    face="Consolas"><FONT color="#800000" size="2" face="Consolas"><FONT color="#800000"
    size="2" face="Consolas">"<%=radGridReports.ClientID
    %>"</FONT></FONT></FONT><FONT size="2" face="Consolas"><FONT size="2" face="Consolas">);</FONT></FONT></P><FONT
    size="2" face="Consolas"><FONT size="2" face="Consolas">
    <P> </P></FONT>
    <P></P></FONT>
    <P><FONT color="#0000ff" size="2" face="Consolas"><FONT color="#0000ff" size="2"
    face="Consolas"><FONT color="#0000ff" size="2"
    face="Consolas">var</FONT></FONT></FONT><FONT size="2" face="Consolas"><FONT
    size="2" face="Consolas"> gridHeight = window.screen.height -
    100;</FONT></FONT></P><FONT size="2" face="Consolas"><FONT size="2" face="Consolas">
     
    <P> </P></FONT>
    <P></P></FONT>
    <P><FONT color="#006400" size="2" face="Consolas"><FONT color="#006400" size="2"
    face="Consolas"><FONT color="#006400" size="2"
    face="Consolas">//grid.get_element().style.height = gridHeight +
    "px";</FONT></FONT></FONT></P><FONT color="#006400" size="2"
    face="Consolas"><FONT color="#006400" size="2" face="Consolas"><FONT color="#006400"
    size="2" face="Consolas"> </FONT></FONT></FONT><FONT size="2"
    face="Consolas"><FONT size="2" face="Consolas">
    <P> </P></FONT>
    <P></P></FONT>
    <P><FONT color="#006400" size="2" face="Consolas"><FONT color="#006400" size="2"
    face="Consolas"><FONT color="#006400" size="2"
    face="Consolas">//grid.clientHeight = gridHeight +
    "px";</FONT></FONT></FONT></P><FONT color="#006400" size="2"
    face="Consolas"><FONT color="#006400" size="2" face="Consolas"><FONT color="#006400"
    size="2" face="Consolas"> </FONT></FONT></FONT><FONT size="2"
    face="Consolas"><FONT size="2" face="Consolas">
    <P> </P></FONT>
    <P></P></FONT>
    <P><FONT color="#006400" size="2" face="Consolas"><FONT color="#006400" size="2"
    face="Consolas"><FONT color="#006400" size="2"
    face="Consolas">//grid.repaint();</FONT></FONT></FONT></P><FONT color="#006400"
    size="2" face="Consolas"><FONT color="#006400" size="2" face="Consolas"><FONT
    color="#006400" size="2" face="Consolas"> </FONT></FONT></FONT><FONT size="2"
    face="Consolas"><FONT size="2" face="Consolas">
    <P> grid.ClientSettings.Height = gridHeight + </P></FONT>
    <P></P></FONT>
    <P><FONT color="#800000" size="2" face="Consolas"><FONT color="#800000" size="2"
    face="Consolas"><FONT color="#800000" size="2"
    face="Consolas">"px"</FONT></FONT></FONT><FONT size="2" face="Consolas"><FONT
    size="2" face="Consolas">;</FONT></FONT></P><FONT size="2" face="Consolas"><FONT
    size="2" face="Consolas">
    <P> </P></FONT>
    <P></P></FONT>
    <P><FONT color="#006400" size="2" face="Consolas"><FONT color="#006400" size="2"
    face="Consolas"><FONT color="#006400" size="2"
    face="Consolas">//grid.get_element().style.height = gridHeight +
    "px";</FONT></FONT></FONT></P><FONT color="#006400" size="2"
    face="Consolas"><FONT color="#006400" size="2" face="Consolas"><FONT color="#006400"
    size="2" face="Consolas"> </FONT></FONT></FONT><FONT size="2"
    face="Consolas"><FONT size="2" face="Consolas">
    <P> </P></FONT>
    <P></P></FONT>
    <P><FONT color="#006400" size="2" face="Consolas"><FONT color="#006400" size="2"
    face="Consolas"><FONT color="#006400" size="2" face="Consolas">//grid.repaint();
    </FONT></FONT></FONT></P><FONT color="#006400" size="2" face="Consolas"><FONT
    color="#006400" size="2" face="Consolas"><FONT color="#006400" size="2" face="Consolas">
    </FONT></FONT></FONT><FONT size="2" face="Consolas"><FONT size="2" face="Consolas">
    <P> </P>
    <P> }</P></FONT></FONT><BR><BR>


  2. Tsvetina
    Admin
    Tsvetina avatar
    1873 posts

    Posted 28 Feb 2012 Link to this post

    Hello Mark,

    Thank you for contacting us.

    Please note, however, that the Code Library type of threads are aimed for sending custom solutions as community resources. The regular forum threads and support tickets can be used for asking for help.

    One problemmatic thing that I see in your code is that you are not correctly accessing the grid object, so you should be getting an error at the line where you try to use the get_element() property.
    In order to fix this, please use the $find(clientId) method instead of $get(clientId) one for accessing the grid control.

    If there are still issues with setting the height of the grid, please open a formal support ticket and place your  latest code and description of the issue.

    Kind regards,
    Tsvetina
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top