Hello @grupoantolin!
We would really appreciate if you provided reproduction sample case in bug reports. Allows us to reduce the guesswork in order to reproduce the issue.
Luckily, this one was easy to (hopefully) be reproduced and I likely could do it with a simplified test case provided in the end of this post.
We have created issue
#1350 to track this bug! This bug has already been reported to the underlying Sencha framework (ExtJS) and they have a working temporary fix for this by adding the following code to your page:
Ext.define('ExtOverrides.grid.NavigationModel', {
override: 'Ext.grid.NavigationModel',
onCellMouseDown: function(view, cell, cellIndex, record, row, recordIndex, mousedownEvent) {
var targetComponent = Ext.Component.fromElement(mousedownEvent.target, cell),
ac;
if (view.actionableMode && (mousedownEvent.getTarget(null, null, true).isTabbable() || ((ac = Ext.ComponentManager.getActiveComponent()) && ac.owns(mousedownEvent)))) {
return;
}
if (mousedownEvent.pointerType !== 'touch') {
// mousedownEvent.preventDefault(); // commented for text selection
this.setPosition(mousedownEvent.position, null, mousedownEvent);
}
if (targetComponent && targetComponent.isFocusable && targetComponent.isFocusable()) {
view.setActionableMode(true, mousedownEvent.position);
targetComponent.focus();
}
}
});
Seems this didn't make it to the latest releases of Sencha ExtJS yet so we'll keep an eye over when there's an update to Ext.NET's underlying framework fixing this for good.
Thanks for reporting the issue!
Simplified test case:
<%@ Page Language="C#" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.Store1.DataSource = this.Data;
}
}
private object[] Data
{
get
{
return new object[]
{
new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" },
new object[] { "American International Group, Inc.", 64.13, 0.31, 0.49, "9/1 12:00am" }
};
}
}
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Simple Array Grid - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" />
<style>
.x-grid-row-over .x-grid-cell-inner {
font-weight : bold;
}
</style>
<script>
var template = '<span style="color:{0};">{1}</span>';
var change = function (value) {
return Ext.String.format(template, (value > 0) ? "green" : "red", value);
};
var pctChange = function (value) {
return Ext.String.format(template, (value > 0) ? "green" : "red", value + "%");
};
</script>
</head>
<body>
<ext:ResourceManager runat="server" />
<h1>Simple Array Grid</h1>
<ext:GridPanel
ID="GridPanel1"
runat="server"
Title="Array Grid"
Width="700"
Height="350">
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="company" />
<ext:ModelField Name="price" Type="Float" />
<ext:ModelField Name="change" Type="Float" />
<ext:ModelField Name="pctChange" Type="Float" />
<ext:ModelField Name="lastChange" Type="Date" DateFormat="M/d hh:mmtt" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:Column runat="server" Text="Company" DataIndex="company" Flex="1" />
<ext:Column runat="server" Text="Price" DataIndex="price">
<Renderer Format="UsMoney" />
</ext:Column>
<ext:Column runat="server" Text="Change" DataIndex="change">
<Renderer Fn="change" />
</ext:Column>
<ext:Column runat="server" Text="Change" DataIndex="pctChange">
<Renderer Fn="pctChange" />
</ext:Column>
<ext:DateColumn runat="server" Text="Last Updated" DataIndex="lastChange" Width="120" />
</Columns>
</ColumnModel>
<ViewConfig EnableTextSelection="true" />
<BottomBar>
<ext:Toolbar runat="server">
<Items>
<ext:Button runat="server" Text="Print" Icon="Printer" Handler="this.up('grid').print();" />
</Items>
</ext:Toolbar>
</BottomBar>
</ext:GridPanel>
</body>
</html>
