Embedded Files
Copying cell content of non-editable Interactive Grid
Hi again,
In this first post of the new year, I'd like to introduce a custom solution for the well-known issue of non-editable Interactive Grid cell content copying.
Or to simplify the problem definition: it is an issue that on a non-editable interactive grid, the copying of a cell is not working. To elaborate, assume we have the non-editable "customers" interactive grid:
When user tries to select a cell value, for example Customer Name column for first row, text selection is disabled by purpose as John Synders mentioned here.
Another option to copy a content, is of course to use right-click, which is also not very helpful because it copies all the columns in the selected row:
To overcome this well-known issue, I first did some research online and found some ideas like:
"Press F8 to toggle between row-select and cell-select."
or
"Add a custom event dynamic action: copy "
For me, these suggestions were not satisfactory because I didn't want users to be forced to forget their usual way of copying things: right click-> copy&paste or directly using shortcuts ctrl+c / ctrl+v.
To fix this issue app-wide, I used my Global Page (page 0 in most cases) and created a Page Load dynamic action with Execute Javascript Code block:
And Javascript Code:
This JS snippet basically
Enable Text Selection: Removes restrictions on selecting text inside the grid's body.
Track Last Selection: Keeps track of the last valid text selection made by the user.
Custom Copy Behavior: Modifies the "copy" action:
•If there's an active selection, it copies the selected text.
•If no text is selected, it falls back to copying the full content of the nearest cell.
Disable Context Menu: Prevents the default right-click context menu within the grid. This one is completely needed for my client needs, you can remove this part if you want to keep the context menu.
And as always, this code was merely created by my client requirements and open to improvements & changes.
After the Javascript code is executed in our application, new copy&paste functionality is as follows for the same Interactive Grid:
Hope it helps and please let me know if you have a better approach or any idea on how to make it better, there is always room for improvement :)
Google Sites
Report abuse