Skip to content

Commit

Permalink
Editor: fix editOn cell reverting to read state when widget dropdown …
Browse files Browse the repository at this point in the history
…is opened

If a cell has 'editOn: "click"' and dijit/form/Select as the editor, clicking
the cell displays the Select, but clicking the Select to open the dropdown
causes a blur which reverts the cell to the read state. This change ignores
blur events from clicking within the dropdown.
  • Loading branch information
msssk committed Jun 19, 2020
1 parent 181509c commit d8bb856
Show file tree
Hide file tree
Showing 2 changed files with 13 additions and 5 deletions.
7 changes: 7 additions & 0 deletions editor.js
Original file line number Diff line number Diff line change
Expand Up @@ -345,6 +345,13 @@ function createSharedEditor(column, originalRenderCell){

function onblur(event){
var wrapperNode;

// a blur caused by clicking within an editor widget's dropDown (e.g. dijit/form/Select) should be
// ignored, otherwise the cell reverts to the read state when the user opens the dropdown
if (cmp.dropDown && cmp.dropDown.domNode.contains(event.relatedTarget || document.activeElement)) {
return;
}

if(event && event.target){
wrapperNode = event.target;
wrapperNode = domClass.contains(wrapperNode, editorFocusWrapperClassName) && wrapperNode;
Expand Down
11 changes: 6 additions & 5 deletions test/editor_more_widgets.html
Original file line number Diff line number Diff line change
Expand Up @@ -12,20 +12,21 @@
font-weight: bold;
padding-bottom: 0.25em;
}
#grid .field-date, #grid .field-date2 {
#grid .field-date,
#grid .field-date2 {
width: 16em;
}
#grid .field-integer {
width: 6em;
}
#grid .field-bool {
width: 6em;
width: 7em;
}
.dgrid {
margin: 10px;
}
</style>
<script src="../../dojo/dojo.js"
<script src="../../dojo/dojo.js"
data-dojo-config="async: true"></script>
<script>
require(["dgrid/List", "dgrid/OnDemandGrid", "dgrid/Selection", "dgrid/Keyboard", "dgrid/editor", "dijit/form/CheckBox", "dijit/form/TimeTextBox", "dijit/form/Select","dojo/data/ObjectStore", "dijit/form/FilteringSelect", "dojo/_base/declare", "dgrid/test/data/base", "dojo/domReady!"],
Expand Down Expand Up @@ -81,7 +82,7 @@
columns: columns,
selectionMode: "none"
}, "grid");

grid.on("dgrid-datachange", function(evt){
console.log("data changed: ", evt.oldValue, " -> ", evt.value);
console.log("cell: ", evt.cell, evt.cell.row.id);
Expand All @@ -93,7 +94,7 @@
console.log("hide editOn editor: ", evt);
});
});

</script>
</head>
<body class="claro">
Expand Down

1 comment on commit d8bb856

@jjpianta
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Similar issue with FilteringSelect and editOn: "dblclick": clicking the dropdown to select an option causes the editor to disappear, leaving the dropdown visible at the top left corner and the cell unchanged.

Easily reproducible in /test/editor_more_widgets.html

Please sign in to comment.