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

How to handle the pop-up window scrollbar

1 Answer 359 Views

Window

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

vincent chen asked on 14 Jul 2010, 08:12 AM

Hi,
i use the radgrid and allows grid can have the scroll bar in the pop-up page, but pop-up window also have scroll bar. this is results in the two scroll bars.That is not what i want.
I don't want to have the window scroll bar,only grid scroll bar.
Could you help me? Thank you!

<!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 runat="server">

<title>Pop-up window scrollbar</title>

<script language="javascript" type="text/javascript">

function showPopUpWin()

{

window.radopen("PopWin.aspx","PopUp");

return false;

}

</script>

</head>

<body>

<form id="form1" runat="server">

<div>

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

</telerik:RadScriptManager>

<input type="button" value="..." onclick="return showPopUpWin();" />

</div>

<telerik:RadWindowManager ID="RadWindowManager1" runat="server">

<Windows>

<telerik:RadWindow ID="PopUp" runat="server" Modal="false" Width="640px" Height="450px">

</telerik:RadWindow>

</Windows>

</telerik:RadWindowManager>

</form>

</body>

</html>

<!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 runat="server">

<title>Pop Window</title>

</head>

<body>

<form id="form1" runat="server">

<div>

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

</telerik:RadScriptManager>

<telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="SqlDataSource1" GridLines="None" Width="600px" Height="400px">

<MasterTableView AutoGenerateColumns="False" DataKeyNames="CustomerID" DataSourceID="SqlDataSource1">

<RowIndicatorColumn>

<HeaderStyle Width="20px" />

</RowIndicatorColumn>

<ExpandCollapseColumn>

<HeaderStyle Width="20px" />

</ExpandCollapseColumn>

<Columns>

<telerik:GridBoundColumn DataField="CustomerID" HeaderText="CustomerID" ReadOnly="True"

SortExpression="CustomerID" UniqueName="CustomerID">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="CompanyName" HeaderText="CompanyName" SortExpression="CompanyName"

UniqueName="CompanyName">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="ContactName" HeaderText="ContactName" SortExpression="ContactName"

UniqueName="ContactName">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="ContactTitle" HeaderText="ContactTitle" SortExpression="ContactTitle"

UniqueName="ContactTitle">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Address" HeaderText="Address" SortExpression="Address"

UniqueName="Address">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="City" HeaderText="City" SortExpression="City"

UniqueName="City">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Region" HeaderText="Region" SortExpression="Region"

UniqueName="Region">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="PostalCode" HeaderText="PostalCode" SortExpression="PostalCode"

UniqueName="PostalCode">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Country" HeaderText="Country" SortExpression="Country"

UniqueName="Country">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Phone" HeaderText="Phone" SortExpression="Phone"

UniqueName="Phone">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Fax" HeaderText="Fax" SortExpression="Fax" UniqueName="Fax">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="bool" DataType="System.Byte" HeaderText="bool"

SortExpression="bool" UniqueName="bool">

</telerik:GridBoundColumn>

</Columns>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="True" UseStaticHeaders="True" />

</ClientSettings>

</telerik:RadGrid>

<asp:SqlDataSource ID="SqlDataSource1" runat="server"

ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" SelectCommand="SELECT TOP 10 *  FROM Customers"></

asp:SqlDataSource>

</div>

</form>

</body>

</html>

1 Answer, 1 is accepted

answered on 16 Jul 2010, 08:10 AM

Hello vincent chen,

To prevent a RadWindow from showing a scrollbar you should resize it to be as big as its content and this is expected and how things work not only with RadControls but also with all standard HTML elements.

To achieve this you can try the following options:

1) If you know the size of the content you can directly specify the Width and Height properties in the markup or use the client setSize method.

2) If you do not know the size of the content you can use the AutoSize property which is demonstrated below:

http://demos.telerik.com/aspnet-ajax/window/examples/autosize/defaultcs.aspx

3) You can calculate the size of the content with some custom javascript and set the desired size with the setSize method.

I hope that my reply is helpful, let me know how it goes.

Best wishes,
Svetlina
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