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

Radio buttons and checkboxes bug

2 Answers 116 Views

FormDecorator

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

Deyan asked on 22 Mar 2011, 04:07 PM

I have simple page:

1 grid with many rows (for scrolling), formdecorator and a checkbox on each row.

When you make a scroll and click at checkbox or radio button then page make scrolling or disappears.

If I avoid them from decorating everything is OK.

P.S For another controls this not happens

Here is the code:

ASPX

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %>

<!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></title>

<telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" />

<style runat="server">

html, body, form

{

overflow:hidden;

height:100%;

}

.scroll

{

overflow:scroll;

height:100%;

}

</style>

</head>

<body>

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

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

<Scripts>

<%--Needed for JavaScript IntelliSense in VS2010--%>

<%--For VS2008 replace RadScriptManager with ScriptManager--%>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />

</Scripts>

</telerik:RadScriptManager>

<script type="text/javascript">

//Put your JavaScript code here.

</script>

<telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="True">

</telerik:RadSkinManager>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

</telerik:RadAjaxManager>

<div>

<telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All" />

</div>

<div class="scroll">

<telerik:RadGrid ID="RadGrid1" runat="server" CellSpacing="0" GridLines="None" OnNeedDataSource="RadGrid1_NeedDataSource">

<MasterTableView>

<CommandItemSettings ExportToPdfText="Export to PDF"></CommandItemSettings>

<RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">

<HeaderStyle Width="20px"></HeaderStyle>

</RowIndicatorColumn>

<ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column">

<HeaderStyle Width="20px"></HeaderStyle>

</ExpandCollapseColumn>

<Columns>

<telerik:GridTemplateColumn HeaderText="Checkox">

<ItemTemplate>

<asp:CheckBox ID="chk" runat="server" />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="text" FilterControlAltText="Filter column1 column"

HeaderText="Text" UniqueName="column1">

</telerik:GridBoundColumn>

</Columns>

<EditFormSettings>

<EditColumn FilterControlAltText="Filter EditCommandColumn column">

</EditColumn>

</EditFormSettings>

</MasterTableView>

<FilterMenu EnableImageSprites="False">

</FilterMenu>

<HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default">

</HeaderContextMenu>

</telerik:RadGrid>

</div>

</form>

</body>

</html>

Code Behind

public partial class Default : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

}

protected void RadGrid1_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)

{

List<string> items = new List<string>();

for(int i = 1; i <= 200; i++)

{

items.Add(string.Format("Item {0}", i));

}

RadGrid1.DataSource = items;

}

2 Answers, 1 is accepted

Accepted

answered on 23 Mar 2011, 09:00 AM

Hello Deyan,

Adding the following CSS (marked in yellow) in the head section of your document, will fix the problem:

<style id="Style1" runat="server" type="text/css">

html, body, form

{

overflow: hidden;

height: 100%;

}

.scroll

{

overflow: scroll;

height: 100%;

}

input.rfdRealInput

{

display: none;

display: block\9;

position: static;

float: right;

outline: 0;

width: 0;

}

</style>

Regards,
Bojo
the Telerik team

Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.