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

Client Height

10 Answers 72 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Cush
Top achievements
Rank 1
Cush asked on 13 Jul 2011, 11:19 PM
Hi All

I have been trying to control the scroll height of a grid using javascript,
I have encountered some problems as the grids are held within pageviews and the client height always returns 0 when in a container of some kind!!!
To work around this is used the row count of the grid to determine the scroll height:
function GridCreated(sender, args) {
                   var scrollArea = sender.GridDataDiv;
                   var masterTable = sender.get_masterTableView();                 
                   var itemCount = masterTable.get_dataItems().length;
                     
                   if (itemCount == 0) {
                       scrollArea.style.height = 17 + "px";
                   }else if (itemCount < 10) {
                       scrollArea.style.height = Math.round((itemCount * 24)) + "px"
                   }
                     
               }

However i am not 100% happy with this as if the row size increases in height the grid will not render correctly.
Is there a work around to get the client height within a page view/container.

Your help would be most appricated.

Best Regards

Cush

10 Answers, 1 is accepted

Sort by
0
Galin
Telerik team
answered on 19 Jul 2011, 01:40 PM
Hi Cush,

With Telerik Client Api it is easy to get the DOM element of the whole RadGrid or any of its components. Also you can easily get their height, eg. :

Javascript:
var radGrid1 = $find('RadGrid1')
radGrid1.get_element(); //returns the DOM element of the wrapper of the grid
radGrid1.get_element().offsetHeight; //returns the height of the RadGrid
radGrid1.get_masterTableView().get_element(); //returns the DOM element of the masterTableView
radGrid1.get_masterTableView().get_element().offsetHeight;  //returns the height of masterTableView

However in your source it seems that you are trying to set calculated height depending on the item count. You can achieve this by with setting ClientSettings-Scrolling-ScrollHeight="", eg:
<ClientSettings>
    <Scrolling AllowScroll="True" ScrollHeight="" />
</ClientSettings>

Please refer to these help topics:
Getting familiar with client side api.
Grid height vs scrollheight.

I hope this helps.

Regards,
Galin
the Telerik team

Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

0
Cush
Top achievements
Rank 1
answered on 22 Jul 2011, 03:34 PM
Hi Galin Many Thanks for the reply and the information, However obtaining the scroll height returns zero due to the grid being inside of a container, in my case a page view, This is why I adopted the approach that I posted, Is there any work around to get the scroll height if the grid is inside of a container / page view? Many thanks Best Regards Cush
0
Galin
Telerik team
answered on 26 Jul 2011, 01:40 PM
Hi Cush,

The scroll height will return zero only in case the height of the Grid is close to zero. It happens when the RadGrid has height="100%" and its container does not have fixed height. For more information on the matter you can refer to the following Code Library and download the file grid_100_width_height.zip:
http://www.telerik.com/community/code-library/aspnet-ajax/grid/setting-100-height-and-resize-on-container-resize-for-grid-with-scrolling-and-static-headers.aspx

However, if the issue persists could you send us more information or a small running project that we can use to reproduce the problem.

Regards,
Galin
the Telerik team

Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

0
Cush
Top achievements
Rank 1
answered on 26 Jul 2011, 02:21 PM

Hi Galin

Thank you for your reply,
I will put in a support ticket on this as my grid does not have 100% height and the container does have a fixed height, also the grid height is not zero!

Nor do i wish it to occupy 100% width or height.

All i want to do is obtain the client height so that i am able to hide the white background that is shown by setting the scroll height property.
I have tried the same approach as THIS article suggests but because the client height returns zero it will not work

Regards

Cush

0
Pavlina
Telerik team
answered on 26 Jul 2011, 03:11 PM
Hi Cush,

The scroll height will return zero only in case the height of the Grid is close to zero. It happens when the RadGrid has height="100%" and its container does not have fixed height. For more information on the matter you can refer to the following Code Library and download the file grid_100_width_height.zip:
http://www.telerik.com/community/code-library/aspnet-ajax/grid/setting-100-height-and-resize-on-container-resize-for-grid-with-scrolling-and-static-headers.aspx

However, if the issue persists could you send us more information or a small running project that we can use to reproduce the problem.

Regards,
Pavlina
the Telerik team

Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

0
Cush
Top achievements
Rank 1
answered on 26 Jul 2011, 03:21 PM
Hi Pavlina

I am confused that you have posted the same answer as Galin?

Rgds

Cush
0
Pavlina
Telerik team
answered on 26 Jul 2011, 04:23 PM
Hello Cush,

Please excuse us for the mistake, I accidentally sent the same answer twice.

However, I suggest that you examine the help articles below which elaborate on this subject and see if they help to achieve your goal.
http://www.telerik.com/help/aspnet-ajax/grid-resize-grid-with-scrolling-when-less-data.html
http://www.telerik.com/help/aspnet-ajax/grid-change-scroll-height-at-runtime.html

Kind regards,
Pavlina
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

0
Cush
Top achievements
Rank 1
answered on 26 Jul 2011, 04:40 PM
Hi Pavlina

Thanks for the reply and the suggested links.
However i have already tried both of these approaches and they fail due to not being able to get the client height as the grid is inside of a pageview?

Best Regards

Cush
0
Pavlina
Telerik team
answered on 27 Jul 2011, 11:20 AM
Hello Cush,

I noticed that you have opened a support ticket with the same question. To avoid duplicate posts I will ask you to continue our communication there.

Regards,
Pavlina
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

0
Cush
Top achievements
Rank 1
answered on 27 Jul 2011, 01:29 PM
Hi Pavlina

No problem at all.

Regards

Cush
Tags
Grid
Asked by
Cush
Top achievements
Rank 1
Answers by
Galin
Telerik team
Cush
Top achievements
Rank 1
Pavlina
Telerik team
Share this question
or