We are using the 2016.2 version but can also reproduce this with the latest (2017.1). We have long column names and users who like to resize columns
Steps to reproduce:
1. Click the first column and change the text - I changed "Sales Representative" in the first record for Nancy to "Test"
2. Resize the first column so you can see the full column name.
Expected results: EditRowEnding event will show ui.update = true and will detect the changed values (in this example - I expected to see Sales Representative in the old values and Test in the new values Actual Results: EditRowEnding event does NOT detect the changed values - ui.update is false and the old values are the same as the new values even though I changed them prior to the row losing focus
I have included an example below:
https://jsfiddle.net/egnLm435/1/
Hello Lisa,
Changes after editing are saved when you either press Enter button or click on another record in the grid. Losing focus by clicking to resize the column header or clicking outside the grid doesn't apply the changes made previously, therefore ui.update will be false and the new value will be equal to the old value.
If you have further questions, please let me know.
Regards,
Tsanna
This is the updated fiddle showing the workaround that we used in the past in 2015.2 but are unable to use in 2016.2 (and 2017.1). Is there a similar workaround that will work for us in the newer versions?
https://jsfiddle.net/egnLm435/9/
Hi Tsanna,
The behavior in the example is exactly what we want! However I'm having a difficult time implementing this suggestion into our larger project.
When I debug the example, the resizing event happens before the edit row ending event, however when I debug our larger project, the edit row ending event happens first (and ui.update is always false).
Is there a setting or property to control the order the grid events are detected in? I'm trying to determine what could be causing the edit row ending event to be triggered first in our larger project but the resizing event to be triggered first in the example?
Thanks,Lisa
In order to address your issue correctly I have the following questions to you:
- what is the exact version including build version in your project
- are you sure that your project doesn't include code that triggers the updating before resizing?
Please let me know if you need further assistance.
We are using 16.2.20162.2114 (this is the latest available via NuGet package manager).
We are using the same events as in the sample (iggridupdatingeditrowending and iggridresizingcolumnresizing). We are also using the group by, paging, sorting, filtering, and column moving options, but even when I remove those options from our code, the edit row ending event always occurs first in our code, however in the fiddle example, the resizing event occurs first.
Is there a way to force one event to trigger first? Or is there a way to prevent a user from resizing the columns if the row is in edit mode? I've tried returning false in the resizing event but this does not work for me as the edit row ending event always occurs first and ui.update is false (like in my original example)
There is an API that checks if the grid is in edit mode: https://www.igniteui.com/help/api/2016.2/ui.iggridupdating#methods:isEditing You may try using it in resizing event.
Also please send me an isolated version of your project that reproduces your issue, so that I can test it on my side.
If you need further assistance, please let me know.
I am still having issues with column resizing.
For the other grid features such as paging, group by, sorting, the isEditing method works perfectly!
iggridpagingpagesizechangingiggridpagingpageindexchangingiggridgroupbygroupedcolumnschangingiggridsortingcolumnsorting
These all work very well and I'm able to return false to force the user to stay in edit mode until they have clicked done or cancel and this behavior is actually what our users prefer.
However, I am unable to return false in the iggridresizingcolumnresizing event in my project and I am able to reproduce this in the fiddle below:
https://jsfiddle.net/egnLm435/22/
To reproduce:Edit a column - I edited Sales Representative to Sales ManagerExpand the "This is a very long title" column so you can see the full column
Expected results: grid will remain in edit mode with user's changed text visibleActual results: edit mode ends and users's changes are lost
It is odd because with other events (paging, group by, sorting) - those events work perfectly!Steps to reproduce expected behavior with other events:Edit a column - I edited Sales Representative to Sales ManagerClick the column name to sortClick the show 5 records dropdownDrag a column into the group by sectionClick the select columns link
Expected results: grid will remain in edit mode with user's changed text visibleActual results: as expected
What can I do to make the columnresizing event detect that the grid is editing and remain in edit mode the way all of these other events do?
I'd appreciate any advice or help you can provide on this.
Thank you,Lisa
This works if immediate propagation is stopped as in this version of the fiddle: https://jsfiddle.net/egnLm435/23/
The reason the events work differently is that Updating stops editing for different reasons. Paging, Sorting, GroupBy, Filtering are features that cause rerendering of data as they produce new data views. Updating recognizes this by handling rendering-related events produced by the grid. These never happen if you cancel the underlying feature-specific events.
With columnResizing editing stops because of the same event that you want to cancel but the cancellation is only recognized by the Resizing feature. Calling stopImmedatePropagation solves this. We stop editing in this case because of how Updating editors are positioned and sized causing column resizing to produce pretty nasty results otherwise.
I hope this helps! Please, let me know if you have any other questions or concerns!
Best regards,
Stamen Stoychev