I have been searching for a client-side, javascript grid that can do what our current winform grids can do. Where most of the javascript grids fall short today is editing with full keyboard support. When developing the editing functionality, please don't require a user to double-click a cell or row to put it into edit mode. As a developer, I need to enable cell-edit simply by setting focus on a cell.
Also, when I am in the cell and want to edit the cell to the right or left, all that should be required is to press Tab or Shift+tab. If I want to edit the cell above or below, the up and down arrow should do the trick. No mouse clicks required!
SlickGrid does an excellent job of this, but unfortunately, it is missing several features that your grid has already. Here's a demo of how I need cell editing and keyboard support to work: http://mleibman.github.com/SlickGrid/examples/example3-editing.html . Make sure you click the Auto-edit On button.
Do you think this would be possible?
Thanks,
Shane Walters
Singletree Technologies
9 Answers, 1 is accepted
Rank 2
Rank 1
Thanks for the reply. I was afraid that might be the answer.
What I would ask is that you use the example that you gave me to update the Product Name with a new name on 20 rows without using your mouse or any pointer device. After doing that, do you agree that the keyboard navigation when editing is the best?
What you have now is very close, it just needs to be tweaked a bit. We should have the option to configure the grid so that setting focus on another cell will immediately put that cell into edit mode.
Do you think there will be ways to customize the grid to edit and navigate cells in a user-friendly way?
Thanks,
-Shane
One can still do this using the arrow keys. To enter edit mode one must press enter.
Technically we can support tabbing however consider the case when you have other input elements in your page which are not in the grid. Once you are in the grid you would need to tab all cells out in order to get to the input elements which are not in the grid. I don't think that this is acceptable behavior. What do you think? How should we deal with the case where the grid is not the only input element in the page?
Atanas Korchev
the Telerik team
Rank 1
Every Windows form and Silverlight grid I've seen allows you to tab to the next field in the grid while in edit mode and the next cell automatically enters edit mode. Here's an example of the Telerik grid allowing you to do this: http://demos.telerik.com/silverlight/#GridView/CellEditTemplate. Perhaps you can discuss with your Silverlight team on the expected behavior of editing and keyboard navigation.
I don't understand why this seems to be a standard in Silverlight grid yet almost no javascript grids will allow the same. If we are to develop rich, line of business applications with HTML5/javascript, we need these features.
Thanks,
-Shane
I know that desktop grids behave in a different way - there is no way to discuss that with the Silverlight team.
However keep in mind that the web is not the same as the desktop. I have provided a link to the guidelines for keyboard navigation which we have followed. I am not aware of any other formal specification how a HTML grid should handle keyboard navigation. I also asked you what we should do in case the grid is not the only editable element in the page. Probably Silverlight provides some way to leave the editable grid during tabing - I am no Silverlight expert so I cannot comment on that. As far as I know in HTML you should just tabbing through a few dozen cells (or a few hundred) in order to reach the textbox after the grid.
Of course if a lot of other users find this normal and expected we can implement it as an option.
Atanas Korchev
the Telerik team
Rank 2
Imagine this approach:
- Focus on a Grid cell, the cell (and Grid) enter editing mode (as in the MVC demo)
- On tab, all cells are presented in Edit Mode
- If editing is complete and you want to tab to other elements on the page, press Escape to exit Grid Edit Mode
Further, we could make entering Grid edit mode configurable: Enter edit mode as soon as a cell has focus OR enter edit mode only on Enter key press. In that way, if it is the desired behavior, tabbing through all elements on the page wouldn't require an "Escape" key press to navigate past the grid if in "Enter key to Edit" mode.
Does that make sense?
-Todd
We can't make all cells in edit mode that easily. Remember that there can't be element with duplicate "id" attribute. All those editors have the same "id" attribute (at least in MVC).
I think we should keep the current approach and implement the option to tab through the whole grid. It should address the original poster's concerns.All the best,
Atanas Korchev
the Telerik team
Rank 1
Users want to enter their data in a grid as fast as they can and pressing enter in every cell to enter/leave edition mode is a waste of time. Imagine you have to add 10 rows with 10 columns each one.
I think users are used to work with grids like the slickGrid sample shows. Users normally use Excel and expect a similar navigation.
I need this behaviour in telerik mvc grid, so I'm spending a lot of hours to get the telerik grid works as our users expect.