GridData Div is always 10px

[Justin]

Please Help,

I have a Grid placed inside a nested multipage.  The Multipage is affected by tabs.  Ill try to explain below.

-outer Multipage
    -PageView: Contains Tabs and Related MultiPage
        -inner MultiPage: Contains Tab Pages which contain the Grids in question
    -PageView: Contains FormView to display the details of the item selected in the other Grids.

So what is happening is that when I wanted to Tabs to postback when selected I set the autopostback to true and then added to the RadAjax manager below

<telerik:AjaxSetting AjaxControlID="Tabs">
    <UpdatedControls>
        <telerik:AjaxUpdatedControl ControlID="Tabs" />
        <telerik:AjaxUpdatedControl ControlID="OuterMultiPage" />
    </UpdatedControls>
</telerik:AjaxSetting>

When the tab is selected it changes the OuterMultiPage to show the Page with the Grids Multipage.  That part works but the GridData section of the grid is set to 10px for the height.  I have no Idea why.  I tried to create a GridCreated client event to set the height back to 100% but then I lose my scrollbars and when I resize the page it goes right back to 10%.

Any Ideas.

Thanks for any help in advance.

[Dimo]

Hi Justin,

Please avoid posting duplicate support tickets and forum threads about the same thing.

Here is my copy-pasted answer to your support ticket:

The observed problem occurs if you violate the CSS standard with regard to percentage heights:

http://www.w3.org/TR/CSS2/visudet.html#the-height-property

<percentage>
Specifies a percentage height. The percentage is calculated with respect to the height of the generated box's containing block. If the height of the containing block is not specified explicitly (i.e., it depends on content height), and this element is not absolutely positioned, the value computes to 'auto'.

In other words, the RadGrid does not have a parent with explicit height in your case. Most probably this is the control's update panel.

Please refer to the following page for more information and an example:

http://www.telerik.com/community/code-library/aspnet-ajax/ajax/how-to-set-100-height-and-random-styles-to-a-radajaxmanager-update-panel.aspx

With the latest RadControls version you don't need to use the programmatic approach. Instead, you can specify UpdatePanelHeight="100%" in the RadGrid AjaxUpdatedControl setting.

<telerik:AjaxSetting AjaxControlID="RadGrid1">
     <UpdatedControls>
          <telerik:AjaxUpdatedControl ControlID="RadGrid1" UpdatePanelHeight="100%" />
     </UpdatedControls>
</telerik:AjaxSetting>

Note that you still need to make sure that the parent of the update panel has an explicit height.

Regards,
Dimo
the Telerik team

[Sameer]

Hi Dimo.  While you may not like that Justin double posted, it may be helpful in some cases to ask the community as well as Telerik support because the community may come up with a different answer.  Also it saves me the hassle of re-posting the same support ticket as I can now see your response to him :)