I have an IFrame inside a RadPane. When the contents of the IFrame overflow the length of the RadPane, a scroll bar shows but it does not allow user to scroll all the way to the bottom of the page. The body of my page is as follows:
| <body style="margin:0px;height:100%;" scroll="no" bgcolor="#38475a"> |
| <form id="form1" runat="server"> |
| <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager> |
| <!-- Navigation and Header --> |
| <table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color: #cccccc;"> |
| <tr style="background-color: #636c7b;" id="NavRow" runat="server"> |
| <td><img src="images/navspacer.jpg" border="0" width="250px" height="29px" alt="" /></td> |
| <td> |
| <ipc:TabNavigation ID="MyNavBar" runat="server" ActiveTab="3" /> |
| </td> |
| <td width="100%" align="right" style="padding-right:4px"><a href="logout.aspx">Log Out</a><ipc:ChangePasswordWindow runat="server" ID="ipcChangePasswordWindow" NavigateUrl="ChangePassword.aspx" VisibleOnPageLoad="false" ReloadOnShow="true" Modal="true" ShowContentDuringLoad="false" SkinID="WebBlue" Width="400" Height="400" Behaviors="None" VisibleStatusbar="false" ShowDividerBeforeLink="true" VisibleTitlebar="False" Skin="WebBlue" /></td> |
| <td rowspan="2" style="width:272px; vertical-align:top;"> |
| <ipc:NewsControl ID="myNewsBar" runat="server" /> |
| </td> |
| </tr> |
| <tr style="background-color: #636c7b;"> |
| <td style="background-image: url(images/g_nav_bg.jpg); background-repeat: repeat-x; height: 29px" width="250px"> |
| </td> |
| <td id="NavCell" class="NavCell" style="background-image: url(images/g_nav_bg.jpg); background-repeat: repeat-x; |
| height: 29px"> |
| </td> |
| <td style="background-image: url(images/g_nav_bg.jpg); background-repeat: repeat-x; |
| height: 29px"> |
| </td> |
| </tr> |
| </table> |
| <telerik:RadSplitter ID="RadSplitter1" |
| runat="server" |
| Width="100%" |
| Height="100%" HeightOffset="58" |
| Skin="WebBlue" |
| BorderSize="0" |
| PanesBorderSize="0" |
| BorderWidth="0"> |
| <telerik:RadPane ID="leftPane" |
| runat="server" |
| Width="273px" |
| Scrolling="None" |
| OnClientPaneExpanded="PaneExpanded" |
| OnClientPaneCollapsed="PaneCollapsed" |
| BorderStyle="None" |
| BorderWidth="0px" |
| BorderColor="#D1D8E2"> |
| <telerik:RadSplitter ID="RadSplitter2" |
| runat="server" |
| Width="100%" |
| Height="100%" |
| Skin="WebBlue" |
| BorderSize="0" |
| PanesBorderSize="0" |
| Orientation="Horizontal" |
| BorderWidth="0"> |
| <telerik:RadPane ID="tabPane" |
| runat="server" |
| Width="273px" |
| Scrolling="None" |
| Height="39px" |
| BorderStyle="None" |
| BorderWidth="0px" |
| BorderColor="#D1D8E2"> |
| <table width="100%" cellpadding="0" cellspacing="0" border="0" bgcolor="#D1D8E2"> |
| <tr> |
| <td height="38px" valign="top"> |
| <a href="archive_basic.aspx"> |
| <img src="images/searchbacktab.jpg" alt="" border="0" width="91" height="39" /> |
| </a> |
| </td> |
| <td id="AdvTab" runat="server" height="39px" valign="top"> |
| <a href="archive_thumbs.aspx"> |
| <img src="images/thumbfronttab.jpg" alt="" border="0" width="91" height="39" /> |
| </a> |
| </td> |
| <td id="LibTab" runat="server" height="39px" valign="top"> |
| <a href="library.aspx"> |
| <img src="images/librarybacktab.jpg" alt="" border="0" width="91" height="39" /> |
| </a> |
| </td> |
| </tr> |
| </table> |
| </telerik:RadPane> |
| <telerik:RadSplitBar ID="RadSplitbar2" runat="server" CollapseMode="None" EnableResize="false"/> |
| <telerik:RadPane ID="navigationPane" |
| runat="server" |
| Width="273px" |
| Scrolling="None" |
| Height="100%" |
| BorderStyle="None" |
| BorderWidth="0px" |
| BorderColor="#D1D8E2"> |
| <telerik:RadSplitter ID="RadSplitter3" |
| runat="server" |
| Width="100%" |
| Height="100%" |
| Skin="WebBlue" |
| BorderSize="0" |
| PanesBorderSize="0" |
| Orientation="Horizontal" |
| BorderWidth="0"> |
| <telerik:RadPane ID="LocationsPane" |
| runat="server" |
| Width="100%" |
| Scrolling="Both" |
| Height="100%" |
| BackColor="#D1D8E2" |
| BorderStyle="None" |
| BorderWidth="0px" |
| BorderColor="#D1D8E2"> |
| <table width="100%" cellpadding="0" cellspacing="0" border="0" bgcolor="#D1D8E2"> |
| <tr> |
| <td valign="top" height="100%" id="RadTreeViewCell"> |
| <telerik:RadTreeView |
| ID="RadTreeView1" |
| runat="server" |
| Height="100%" |
| AutoPostBack="True" |
| OnClientNodeExpanded="onClientNodeToggle" |
| OnClientNodeCollapsed="onClientNodeToggle" |
| OnClientNodeClicked="ClientClickHandler"> |
| </telerik:RadTreeView> |
| </td> |
| </tr> |
| </table> |
| </telerik:RadPane> |
| <telerik:RadSplitBar ID="RadSplitbar3" runat="server" CollapseMode="None" EnableResize="false"/> |
| <telerik:RadPane ID="DatePreviewPane" |
| runat="server" |
| Width="273px" |
| Height="215px" |
| Scrolling="None" |
| BorderStyle="None" |
| BorderWidth="0px" |
| BorderColor="#D1D8E2" |
| BackColor="#D1D8E2"> |
| <table width="100%" cellpadding="0" cellspacing="0" border="0" bgcolor="#D1D8E2"> |
| <tr> |
| <td colspan="3" valign="bottom" align="center"> |
| <table cellpadding="0" cellspacing="0" width="100%"> |
| <tr> |
| <td class="PaneHeader" align="center" style="padding-right:14px"> |
| Date |
| </td> |
| </tr> |
| <tr> |
| <td style="padding-top:10px;padding-bottom:10px" align="center"> |
| <asp:Calendar ID="Calendar1" runat="server" BorderColor="darkslategray" BorderStyle="solid" BorderWidth="0" Font-Size="XX-Small" Font-Names="Verdana" BackColor="white" Width="200px" Height="160px"></asp:Calendar> |
| </td> |
| </tr> |
| </table> |
| </td> |
| </tr> |
| </table> |
| </telerik:RadPane> |
| </telerik:RadSplitter> |
| </telerik:RadPane> |
| </telerik:RadSplitter> |
| </telerik:RadPane> |
| <telerik:RadSplitBar ID="RadSplitbar1" runat="server" CollapseMode="Forward" EnableResize="false"/> |
| <telerik:RadPane ID="rightPane" |
| runat="server" |
| Scrolling="Y" |
| BackColor="#232323" |
| BorderStyle="None" |
| BorderWidth="0px" |
| BorderColor="#D1D8E2"> |
| <iframe id="ThumbFrame" src="thumb_detail.aspx" frameborder="0" width="100%" height="100%" runat="server" scrolling="no"></iframe> |
| </telerik:RadPane> |
| </telerik:RadSplitter> |
| </form> |
| </body> |
When the ThumbFrame iFrame has many images, the user cannot scroll down to see all of them.
Here is an example html generated by thumb_detail.aspx :
| <!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><title> |
| </title><link href="StyleSheet.css" type="text/css" rel="STYLESHEET" /> |
| </head> |
| <body style="background-color:#232323"> |
| <form name="form1" method="post" id="form1"> |
| <div id="divThumbnails"> |
| <table> |
| <tr> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/100000.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/100100.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/100300.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/101500.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| </tr> |
| <tr> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/102100.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/102600.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/103400.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/103500.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| </tr> |
| <tr> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/103600.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/103800.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td><td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/104000.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/104100.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| </tr> |
| <tr> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/104200.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/104400.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/104700.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/104900.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| </tr> |
| <tr> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/105000.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/105100.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/105200.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/105300.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| </tr> |
| <tr> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/105400.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/105600.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/105700.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/105800.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| </tr> |
| <tr> |
| <td class="grid"> |
| <img alt="" src="http://192.168.100.40/Store1/20090903/192.168.50.61_80/Camera_1/105900.jpg" height="180px" width="240px" id="" style="border:none" /> |
| </td> |
| <td> </td> |
| <td> </td> |
| <td> </td> |
| </tr> |
| </table> |
| </div> |
| </form> |
| </body> |
| </html> |
| <asp:ScriptManager ID="ScriptManager" runat="server" /> |
| <telerik:RadWindowManager ID="Singleton" VisibleStatusbar="true" Behaviors="Close,Resize,Move" DestroyOnClose="false" runat="server" > |
| <Windows> |
| <telerik:RadWindow ID="objEmailWindow" InitialBehavior="Maximize" DestroyOnClose="false" Width="650" Height="650" runat="server" ShowContentDuringLoad="false" /> |
| <telerik:RadWindow ID="objMoveFileWindow" InitialBehavior="Maximize" DestroyOnClose="false" Width="650" Height="325" runat="server" ShowContentDuringLoad="false" /> |
| </Windows> |
| </telerik:RadWindowManager> |
| function openWindow(url, windowName) { |
| window.radopen(url, windowName); |
| } |
| Private Sub RadGrid_Entreprise_ItemInserted(ByVal source As Object, ByVal e As Telerik.Web.UI.GridInsertedEventArgs) Handles RadGrid_Entreprise.ItemInserted |
| Me.RadGrid_offre.Rebind() |
| Me.RadGrid_Offre_Programme.Rebind() |
| End Sub |
Hi,
I have a Button skin file that does skinning for the ASP.NET Button control. The problem I have is it is overriding the button within the RadGrid. For example, the Add new and Refresh buttons are shown in the same style as the other buttons on my website are. The button skin seems to override the styles applied even though I have the !important setting set.
This is my skin file to control Buttons:
< asp:Button runat="server" CssClass="MainButton"></asp:Button>
Here is the pertinent css inside my custom css class:
| .RadGrid_[myskinname].rgAdd |
| { |
| background-position:0 -1856px !Important; |
| } |
| .RadGrid_[myskinname].rgRefresh |
| { |
| background-position:0 -1824px !Important; |
| } |
| .RadGrid_[myskinname].rgEdit |
| { |
| background-position:0 -1888px !Important; |
| } |
| .RadGrid_[myskinname].rgDel |
| { |
| background-position:0 -1920px !Important; |
| } |
| .RadGrid_[myskinname] .rgAdd, |
| .RadGrid_[myskinname] .rgRefresh, |
| .RadGrid_[myskinname] .rgEdit, |
| .RadGrid_[myskinname] .rgDel, |
| .RadGrid_[myskinname] .rgFilter, |
| .RadGrid_[myskinname] .rgPagePrev, |
| .RadGrid_[myskinname] .rgPageNext, |
| .RadGrid_[myskinname] .rgExpand, |
| .RadGrid_[myskinname] .rgCollapse, |
| .RadGrid_[myskinname] .rgSortAsc, |
| .RadGrid_[myskinname] .rgSortDesc |
| .RadGrid_[myskinname] .rgUpdate, |
| .RadGrid_[myskinname] .rgCancel |
| { |
| width:16px !important; |
| height:16px !important; |
| border:0 !important; |
| padding:0 !important; |
| background-color:transparent !important; |
| background-image:url('Grid/sprite.gif') !important; |
| background-repeat:no-repeat !important; |
| vertical-align:middle !important; |
| cursor:pointer !important; |
| } |
Is there any way to prevent RadGrid from inheritting the ASP.NET Skin file?
Thanks, Josh
function
PerformSearch()
{
var tree = $find("MenuTree");
var strToSearch = document.getElementById("txtSearchText").value;
var node = tree.findNodeByText(strToSearch);
var ParentNode=null;
if(node)
{
node.highlight();
node.scrollIntoView();
ParentNode = node.get_parent();
while (ParentNode != null)
{
ParentNode.expand();
ParentNode = node.get_parent();
}
}
}