Apr 08, 2013, 7:39 PM
[CLOSED] [#196] slightly difference between clicking the Row and clicking Row's Checker
Hi folks, i found an slightly difference between clicking the row and clicking row's checker
First Scenario
When Record 2 is selected by clicking on the row:
When Record 6 is selected by clicking on the row:
Second Scenario - SELECTION MUST BE CLEARED
When Record 2 is selected by clicking on row's checker:
When Record 6 is selected by clicking on row's checker:
Note that on the second scenario, both Record 2 and Record 6 are selected, when only Record 6 was supposed to be selected, since the CRTL Key was not pressed during selection.
The problem was caused because the SelectionModel's OnRowMouseDown method sets the SelectionMode to Simple if the SelectionMode is not set to Single and if the source of the event was the Row's Checker, as shown below - Lines 12 to 15:
Note: the method was minified
Thanks in advance
To check it out, it's possible to use the following example:
https://examples2.ext.net/#/GridPane...box_Selection/
or run the following code:
1 - View
First Scenario
When Record 2 is selected by clicking on the row:
When Record 6 is selected by clicking on the row:
Second Scenario - SELECTION MUST BE CLEARED
When Record 2 is selected by clicking on row's checker:
When Record 6 is selected by clicking on row's checker:
Note that on the second scenario, both Record 2 and Record 6 are selected, when only Record 6 was supposed to be selected, since the CRTL Key was not pressed during selection.
The problem was caused because the SelectionModel's OnRowMouseDown method sets the SelectionMode to Simple if the SelectionMode is not set to Single and if the source of the event was the Row's Checker, as shown below - Lines 12 to 15:
Note: the method was minified
onRowMouseDown = function (b, a, h, d, i) {
b.el.focus();
var g = this,
c = i.getTarget("." + Ext.baseCSSPrefix + "grid-row-checker"),
j;
if (!g.allowRightMouseSelection(i)) {
return
}
if (g.checkOnly && !c) {
return
}
if (c) {
j = g.getSelectionMode();
if (j !== "SINGLE") {
g.setSelectionMode("SIMPLE")
}
}
}
it's possible to see the difference when the SelectionMode is set to Simple, instead of MultiselectWithEvent: function (record, e, keepExisting) {
var me = this;
switch (me.selectionMode) {
case 'MULTI':
if (e.ctrlKey && me.isSelected(record)) {
me.doDeselect(record, false);
} else if (e.shiftKey && me.lastFocused) {
me.selectRange(me.lastFocused, record, e.ctrlKey);
} else if (e.ctrlKey) {
me.doSelect(record, true, false);
} else if (me.isSelected(record) && !e.shiftKey && !e.ctrlKey && me.selected.getCount() > 1) {
me.doSelect(record, keepExisting, false);
} else {
me.doSelect(record, false);
}
break;
case 'SIMPLE':
if (me.isSelected(record)) {
me.doDeselect(record);
} else {
me.doSelect(record, true);
}
break;
case 'SINGLE':
// if allowDeselect is on and this record isSelected, deselect it
if (me.allowDeselect && me.isSelected(record)) {
me.doDeselect(record);
// select the record and do NOT maintain existing selections
} else {
me.doSelect(record, false);
}
break;
}
}
In my scenario it's not expected that SelectionMode is set to Simple, then it's possible to overcome this issue by overriding Ext.selection.Model.selectWithEvent, as shown below:
Ext.selection.Model.override({
selectWithEvent: function (record, e, keepExisting) {
var me = this;
switch (me.selectionMode) {
case 'MULTI':
case 'SIMPLE':
if (e.ctrlKey && me.isSelected(record)) {
me.doDeselect(record, false);
} else if (e.shiftKey && me.lastFocused) {
me.selectRange(me.lastFocused, record, e.ctrlKey);
} else if (e.ctrlKey) {
me.doSelect(record, true, false);
} else if (me.isSelected(record) && !e.shiftKey && !e.ctrlKey && me.selected.getCount() > 1) {
me.doSelect(record, keepExisting, false);
} else {
me.doSelect(record, false);
}
break;
case 'SINGLE':
// if allowDeselect is on and this record isSelected, deselect it
if (me.allowDeselect && me.isSelected(record)) {
me.doDeselect(record);
// select the record and do NOT maintain existing selections
} else {
me.doSelect(record, false);
}
break;
}
}
});
I would like to know about what you think about this issue, whether it's a bug, etc. Thanks in advance
To check it out, it's possible to use the following example:
https://examples2.ext.net/#/GridPane...box_Selection/
or run the following code:
1 - View
<!DOCTYPE html>
<html>
<head runat="server">
</head>
<body>
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:GridPanel ID="GridPanel1" Title="Records" runat="server">
<Store>
<ext:Store runat="server">
<Proxy>
<ext:AjaxProxy Url="/Example/LoadFakeRecords/">
<ActionMethods Read="POST" />
<Reader>
<ext:JsonReader Root="data" />
</Reader>
</ext:AjaxProxy>
</Proxy>
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="ID" Type="String" />
<ext:ModelField Name="Name" Type="String" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:Column Text="ID" DataIndex="ID" runat="server" />
<ext:Column Text="Name" Width="500" DataIndex="Name" runat="server" />
</Columns>
</ColumnModel>
<SelectionModel>
<ext:CheckboxSelectionModel Mode="Multi" runat="server" />
</SelectionModel>
</ext:GridPanel>
</body>
</html>
2 - Utilitypublic class ExampleController : System.Web.Mvc.Controller
{
public ActionResult Index()
{
return View();
}
public StoreResult LoadFakeRecords()
{
List<Entity> lst = new List<Entity>();
for (int index = 0; index < 15; index++)
{
lst.Add(new Entity
{
ID = index,
Name = Guid.NewGuid().ToString()
});
}
return new StoreResult(lst, lst.Count());
}
}
3 - Controllerpublic class Entity
{
public int ID { get; set; }
public string Name { get; set; }
}
Last edited by Daniil; Dec 19, 2014 at 7:51 PM.
Reason: [CLOSED]