Oct 11, 2013, 2:53 PM
[CLOSED] Problems with locking Grid and Cell editing using RowSelectionModel
Hi,
as usual it is about locking Grid... This time there are multiple problems with editor if I use RowSelectionModel.
To reproduce:
Take your Example (https://examples2.ext.net/#/GridPane.../Cell_Editing/) and use RowSelectionModel instead of CellSelectionModel, add a column with TextArea Editor which has multiple rows - like this:
Problem 2: select a cell in the unlocked column with text-area-editor - editor should appear with upper border upon upper border of the selected cell but is kind of centered. Not sure if this is feature or bug but I'd like to have the upper border upon the upper border of the cell - is there a solution?
Problem 3: (extends Problem 2) if you select the top-cell of the column which uses text-area the column-header is overlayed.
Thanks in advance!
as usual it is about locking Grid... This time there are multiple problems with editor if I use RowSelectionModel.
To reproduce:
Take your Example (https://examples2.ext.net/#/GridPane.../Cell_Editing/) and use RowSelectionModel instead of CellSelectionModel, add a column with TextArea Editor which has multiple rows - like this:
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.GridPanel1.Store.Primary.DataSource = 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" },
new object[] { "AT&T Inc.", 31.61, -0.48, -1.54, "9/1 12:00am" },
new object[] { "Boeing Co.", 75.43, 0.53, 0.71, "9/1 12:00am" },
new object[] { "Caterpillar Inc.", 67.27, 0.92, 1.39, "9/1 12:00am" },
new object[] { "Citigroup, Inc.", 49.37, 0.02, 0.04, "9/1 12:00am" },
new object[] { "E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28, "9/1 12:00am" },
new object[] { "Exxon Mobil Corp", 68.1, -0.43, -0.64, "9/1 12:00am" },
new object[] { "General Electric Company", 34.14, -0.08, -0.23, "9/1 12:00am" },
new object[] { "General Motors Corporation", 30.27, 1.09, 3.74, "9/1 12:00am" },
new object[] { "Hewlett-Packard Co.", 36.53, -0.03, -0.08, "9/1 12:00am" },
new object[] { "Honeywell Intl Inc", 38.77, 0.05, 0.13, "9/1 12:00am" },
new object[] { "Intel Corporation", 19.88, 0.31, 1.58, "9/1 12:00am" },
new object[] { "International Business Machines", 81.41, 0.44, 0.54, "9/1 12:00am" },
new object[] { "Johnson & Johnson", 64.72, 0.06, 0.09, "9/1 12:00am" },
new object[] { "JP Morgan & Chase & Co", 45.73, 0.07, 0.15, "9/1 12:00am" },
new object[] { "McDonald\"s Corporation", 36.76, 0.86, 2.40, "9/1 12:00am" },
new object[] { "Merck & Co., Inc.", 40.96, 0.41, 1.01, "9/1 12:00am" },
new object[] { "Microsoft Corporation", 25.84, 0.14, 0.54, "9/1 12:00am" },
new object[] { "Pfizer Inc", 27.96, 0.4, 1.45, "9/1 12:00am" },
new object[] { "The Coca-Cola Company", 45.07, 0.26, 0.58, "9/1 12:00am" },
new object[] { "The Home Depot, Inc.", 34.64, 0.35, 1.02, "9/1 12:00am" },
new object[] { "The Procter & Gamble Company", 61.91, 0.01, 0.02, "9/1 12:00am" },
new object[] { "United Technologies Corporation", 63.26, 0.55, 0.88, "9/1 12:00am" },
new object[] { "Verizon Communications", 35.57, 0.39, 1.11, "9/1 12:00am" },
new object[] { "Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63, "9/1 12:00am" }
};
this.GridPanel1.Store.Primary.DataBind();
}
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Locking Column Cell Editing - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" />
<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 ID="ResourceManager1" runat="server" />
<h1>Locking Column Cell Editing Example</h1>
<p>This example shows how to edit a locking Panel using cell editing.</p>
<p>It is not possible to lock or unlock <i>all</i> columns using the user interface. Each side, locked or unlocked must always contain at least one column.</p>
<ext:GridPanel
ID="GridPanel1"
runat="server"
ColumnLines="true"
Title="Locking Grid Column"
Width="600"
Height="350">
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model ID="Model1" 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 ID="Column1" runat="server" Text="Company<br>Name" DataIndex="company" Width="200" Locked="true" Sortable="false">
<Editor>
<ext:TextField ID="TextField1" runat="server" />
</Editor>
</ext:Column>
<ext:Column ID="Column5" runat="server" Text="Test" DataIndex="company" Width="200" Sortable="false">
<Editor>
<ext:TextArea ID="ta_desc_de" runat="server" AutoScroll="true" Grow="true" MaxLengthText="140" EnforceMaxLength="true"
Rows="3" MaskRe="[^<^>]" />
</Editor>
</ext:Column>
<ext:Column ID="Column2" runat="server" Text="Price" DataIndex="price" Width="97" Lockable="false">
<Renderer Format="UsMoney" />
<Editor>
<ext:NumberField ID="NumberField1" runat="server" />
</Editor>
</ext:Column>
<ext:Column ID="Column3" runat="server" Text="Change" DataIndex="change" Width="97">
<Renderer Fn="change" />
<Editor>
<ext:NumberField ID="NumberField2" runat="server" />
</Editor>
</ext:Column>
<ext:Column ID="Column4" runat="server" Text="% Change" DataIndex="pctChange" Width="97">
<Renderer Fn="pctChange" />
<Editor>
<ext:NumberField ID="NumberField3" runat="server" />
</Editor>
</ext:Column>
<ext:DateColumn ID="DateColumn1" runat="server" Text="Last Updated" DataIndex="lastChange" Width="97">
<Editor>
<ext:DateField ID="DateField1" runat="server" />
</Editor>
</ext:DateColumn>
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" />
</SelectionModel>
<Plugins>
<ext:CellEditing ID="CellEditing1" runat="server" ClicksToEdit="1" />
</Plugins>
</ext:GridPanel>
</body>
</html>Problem 2: select a cell in the unlocked column with text-area-editor - editor should appear with upper border upon upper border of the selected cell but is kind of centered. Not sure if this is feature or bug but I'd like to have the upper border upon the upper border of the cell - is there a solution?
Problem 3: (extends Problem 2) if you select the top-cell of the column which uses text-area the column-header is overlayed.
Thanks in advance!
Last edited by Daniil; Oct 18, 2013 at 4:46 AM.
Reason: [CLOSED]
Originally Posted by g-tech
