IgniteUI / ignite-ui

Ignite UI for jQuery by Infragistics

Home Page:https://bit.ly/2kuu1fT

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[IE11] igNumericEditor does not commit input value by the time the focus moves to igGrid row

ymita opened this issue · comments

Description

igNumericEditor does not commit input value by the time the focus moves to igGrid row (rowSelectionChanging event). This happens only on IE11.

  • ignite-ui version: 19.2.25
  • browser: IE11

Steps to reproduce

  1. Run the attached sample
  2. Enter '123' to igNumericEditor
  3. Click a row on igGrid
  4. Enter '456' to igNumericEditor
  5. Click a row on igGrid
    igNumericEditor_value

Result

On step 3, value input on igNumericEditor is not committed so that igNumericEditor's value option or method does not return the displayed value.
On step 5, the retrieved value from igNumericEditor is '123'.

Expected result

On step 3, value input on igNumericEditor is committed so that igNumericEditor's value option or method returns the displayed value.
On step 5, the retrieved value from igNumericEditor should be '456'.

Note

The application works as expected with Chrome and Firefox.

Attachments

index.zip

The fix that needs to be added in the application is the following (see also the attached file):

rowSelectionChanging: function(evt, ui) {
    $('#num').igNumericEditor("field").blur();
    ...

Because at the time the rowSelectionChanging event is fired, the igNumericEditor is not blurred, therefore editor's value is not updated, the solution above will force the editor's value update before any other logic in the grid to be executed.

What really is happening, is the following. You can look at the attached demo and the event handlers attached to the editor, grid and one HTML div. If you focus editor and update its value (with 123) then click on the HTML div (the same will happen also for the igGrid) the event order is the following:

  1. DIV pointer down (only in IE11)
  2. DIV mousedown
  3. igEditor blur
  4. igEditor valueChanged: 123
  5. DIV pointer up (only in IE11)
  6. DIV mouseup

This behavior is the same in all browsers. The selection in the igGrid happens in mousedown event grid's handler. Therefore the logic of grid selection starts before editor's update of the value. In that case, it seems that the behavior in IE seems more correct than that in the Chrome browser. However, this depends more on how fast the logic of the grid selection or editor update value is executed. And in the Chrome and IE11 the execution differs.

Since the time the igNumericEditor and igGrid have been created, browser events and their execution order may have changed. Having a solution like above is preferable than changing the components logic and their event handling, because this may destabilize them. Closing the bug as not-to-fix.

index.zip