Why does row selection cause the screen to jump to make the top of the grid visible. It only occurs in IE, Google Chrome (and Firefox as well) behaves as expected, making the row selection but keeping the webform in place and not jumping. ASPX and Code Behind to reproduce are below:
WebForm1.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication3.WebForm1" %>
<%@ Register Assembly="Infragistics4.Web.v10.2, Version=10.2.20102.1011, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb" Namespace="Infragistics.Web.UI.GridControls" TagPrefix="ig" %>
<!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>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<ig:WebDataGrid ID="WebDataGrid1" runat="server" Width="400px">
<Behaviors>
<ig:RowSelectors RowNumbering="True">
</ig:RowSelectors>
<ig:Selection CellClickAction="Row" CellSelectType="None"
RowSelectType="Multiple">
</ig:Selection>
</Behaviors>
</ig:WebDataGrid>
</div>
</form>
</body>
</html>
Both things can be done with CSS. You can remove border rectangle like apply custom CSS class to Activation:
<ig:Activation Enabled="true" ActiveCellCssClass="igg_ActiveCell"/>
Removing row selector highlight is little more specific. You have to edit ig_dataGrid.css which is located in your ig_res\Default folder. Find .igg_ActiveRowSelector and comment everything between the curly brackets. This will remove highlight on deselection.
I modified your sample. Please refer to the attached file. Note that ig_res folder is missing in the archive because there is limit upload file size. You have to copy ig_res folder and after that replace ig_grid.css with the new one.
Please let me know if need additional assistance.
That worked, but now it has some other undesired effects, see screenshots.
1) How do i remove the cell selection border/focus rectangle?
2) When row is deselected, how to i remove the highlight on the row selector?
Hello Scott,
you have to enable Activation: <Behaviors> <ig:Activation Enabled="true" /> <ig:RowSelectors RowNumbering="True"> </ig:RowSelectors> <ig:Selection CellClickAction="Row" CellSelectType="None" RowSelectType="Multiple"> </ig:Selection></Behaviors>
Please let me know if you have any further questions with this matter.