RadPanelBar inside Sharepoint 2007 Masterpage not resizing

[Larry Cage]

Hi all.

I have a RadPanelBar inside of a Table that is set to a height of 100%.  The RadPanelBar is also set to 100%.

The basic structure of the panel is this:

<t

 

 

elerik:RadPanelBar ID="RadPanelBar1" runat="server" onitemclick="RadPanelBar1_ItemClick" CausesValidation="False" ExpandMode="FullExpandedItem" BorderWidth="0px"height="100%" Width="100%">
 <Items>
 <telerik:RadPanelItem runat="server" Expanded="True" Selected="True" Text="HOME" Value="parent">
 <Items>
 <telerik:RadPanelItem runat="server" Text="LINKS" Value="links">
 </telerik:RadPanelItem>
 <telerik:RadPanelItem runat="server" Text="about us" Value="aboutus">
 </telerik:RadPanelItem>
 <telerik:RadPanelItem runat="server" Text="contact us" Value="contactus">
 </telerik:RadPanelItem>
<telerik:RadPanelItem runat="server" Text="portal login" Value="login">
 </telerik:RadPanelItem>
 </Items>
 </telerik:RadPanelItem>
</telerik:RadPanelBar>

My Table is 1 row 2 columns.  The background of column 1 is gray.  This is where the RadPanel lives.
In IE8 and Chrome the page renders as expected. The panel is expanded and i can see all of HOMEs child items.

In Firefox the panel is shrunk and only displays the first child "LINKS" under home.  However, the column in which it resides is full height because i can see the gray background in the open space.

Any thoughts as to how to increase the height of the RadPanelItem to fill the column?

 

 

 

Thanks

 

[Peter]

Hi Larry,

We could not replicate this problem locally. Can you send us your web part or a live url so we can test it?


Regards,
Peter
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[mc2000]

I'm starting to thing the problem is the RadAjaxPanel. If I REMOVE THE AJAX PANEL altogether, and set height of the panelbar to 100%, it works in IE and FF. If I LEAVE THE PANEL and set the panelbar to 100% height, it works in IE but not Firefox. FF seems to be limiting the height of the PanelBar to the height of the surrounding ajax panel. I even tried adding

    <style type="text/css">
        .ctl00_NavigationAjaxPanel {height:100%;}
    </style>

and it failed. On that note, finally, if I set the AJAX PANEL height to 100% AND I set the Panelbar height to 100%, it does NOT work in IE or FireFox. It doesn't seem to be making the ajax panel a true 100% of the td. A screenshot attachment shows the details of this.

[mc2000]

By the way, I added the following JavaScript and it seems to work fine in IE and FireFox on WINDOW RESIZE only. It does not seem to work on WINDOW LOAD even though the alert pops up for both.

 

            function resizePanelBar() {
                var thePanelbar = document.getElementById("<%=RadPanelBar1.ClientID%>");
                var theSidebar = document.getElementById("Sidebar");

                thePanelbar.style.height = theSidebar.offsetHeight + "px";
                //alert(theSidebar.offsetHeight);

            }

                window.onload = resizePanelBar;
                window.onresize = resizePanelBar;

[Veselin Vasilev]

Hello,

Instead of using window.onload please use the pageLoad() function because in ajax page the window.onload executes too early (link) and the controls might not have been initialized.

Here is how it should look like:

function resizePanelBar() {
   var thePanelbar = document.getElementById("<%=RadPanelBar1.ClientID%>");
   var theSidebar = document.getElementById("Sidebar");

   thePanelbar.style.height = theSidebar.offsetHeight + "px";
   //alert(theSidebar.offsetHeight);
}

window.onresize = resizePanelBar;
Sys.Application.add_load(resizePanelBar);

Let us know how it goes.

Regards,
Veskoni
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[mc2000]

This seems to work with one caveat:

Let's assume my browser window is 800 px tall. I then resize it to 900 px. The table stretches as does the panelbar as expected. All good.

If I then change the height back to 800px the table nor the panel resizes. If I do a postback everything does resize, though. Any thoughts? Thanks!

[Kamen Bundev]

Hi Mark,

We can't reproduce the issue here and we don't know the actual layout of your page to test it reliably. Can you send a sample page and the CSS loaded on it, or at least the RadPanelBar definition with all its containers again along with the CSS? Thank you in advance.

Best wishes,
Kamen Bundev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.