I use jqGrid and want the grid to be scrollable by keys. The UP/DOWN functionality should be just like here, but when a user pressed ENTER or clicks on a row, a user is redirected to a different page.
What I have so far is
Code that redirects a user to a different page in onSelectRow
.jqGrid('bindKeys')
Two problems now:
When pressing UP/DOWN a user goes to a different row and then the code in onSelectRow is executed. How do I prevent that?
When pressing UP/DOWN, the entire screen scrolls a little bit. How do I prevent screen scrolling from happening?
Thank you.
I was able to address the first issue of onSelectRow being fired on UP/DOWN by checking the event parameter that this method receives for keyCode 38 and 40. That allowed me to scroll the grid without executing my code in onSelectRow. The second issue of the entire screen moving somehow went away "on its own".
Related
I have some pages where I have a kendo ui grid (wired up to full CRUD services), but use a separate Kendo UI Toolbar control (as opposed to the toolbar configuration in the grid itself). I have a number of different buttons/menus on the toolbar, but am seeing a strange behavior when calling saveChanges() on the grid. If a cell is being edited when the save button is clicked, the grid is saved, but the edited value is lost (it reverts back to where it was). The following details what I see in different situations:
When using a save button configured in the grid (command: "save"), any changes in a cell being edited are committed with the save.
When using a plain html button that calls the saveChanges() method of the grid, any changes in a cell being edited are committed with the save.
When using a save button configured in a toolbar control, the changes in a cell being edited are LOST when saveChanges() is called.
The following jsbin shows the behavior of all three:
http://jsbin.com/jazobexatu/2/edit?html,js,output
I have tried calling the save from the toolbar button a number of different ways (even trying to trigger the click event of the external button), but nothing seems to correct the behavior. I also tried calling closeCell() on the grid (to try to force the value back into the data, but that doesn't work either). I haven't been able to debug the javascript enough to figure out what is different. I'm hoping someone with a deeper understanding of these controls can help me out.
For some reason, the mouse down event on the toolbar button doesn't cause a blur on the editor.
You can try it yourself by clicking in the cell to edit it, then click and hold the mouse button down on the "normal" button. The editor closes on mouse down, causing a blur of the editor, and persists the change.
If you do the same thing, click and hold mouse down, on the toolbar button, the editor stays open.
I've been poking through the source, but haven't figured out exactly why this happens. My best guess would be that the mousedown handler on the toolbar prevents the event from bubbling or running its default action and the editor doesn't blur.
Additional detail: On mousedown on the grid header button and the normal button, the focused element changes (which is what causes the editor blur). But on mousedown of the toolbar button, the editor input element still has the focus.
Shifting the focus on mousedown of the toolbar might be a workaround.
Sort of a weird hack, but this works in Chrome (any should in any browser that supports activeElement
click: function (e) {
$(document.activeElement).blur();
$("#grid").data("kendoGrid").saveChanges();
}
I was wondering, I'm currently using a slide in and out page transition when the user presses a Next of Previous button on the appbar.
( concept: going through a set of articles inside a selected category )
This all looks great, I'm also able add the drag / flick gesture listeners to trigger this page transition... so no problems there.
But now I wanted to add the final part, when the user starts the drag / flick gesture, show this visually so that the page follows the gesture and 'slides' out of frame.
But how to do this? An example would be great :)
But there is also a small extra thing, I don't want the user to always do a full drag... so if we are over 2/3 of the screen, auto start the page transition IF the gesture stops ( so the user lifts up his finger )
So I would like to create a nice reading experience that shows the gesture visualy and performs the page transition...
You can check the following link: https://stackoverflow.com/a/9915016/1565574
In the ManipulationCompleted you'll be able to detect the GestureType and take an action there.
And I found that link: https://stackoverflow.com/a/4342558/1565574 (using the GestureService)
I first started with the DragFlickBehavior from #LocalJoost and it actually worked great!
But in the end I switched to a headerless pivot! Works also great!
I have set up my table view to work kinda like the Twitter app meaning when you hover over each row icons will appear on the right side and when leaving the row they will disappear. I coded it based upon this:
mouseExited isn't called when mouse leaves trackingArea while scrolling
The very strange thing is I have a checkbox on each row (along with other text fields, etc.) and when clicking the checkbox it causes the icons for that row to jump to the next row. Clicking the checkbox again will cause them to jump to the next row. This repeats until the icons jump to the last visible row then they will jump to the first visible row and keep repeating this behavior. And it happens only sometimes. :-/ I tried to figure this out but nothing is even being called when this happens meaning no call to tracking areas or mouse entered/exited nothing. Does this make any sense at all and maybe considering I'm trying to recreate how Twitter does it did I code it wrong?
Thanks,
rc
I have 2 NSButtons, both are bordered momentary push-in buttons. I have a main window to which other views are swapped in and out. These two buttons are in the main window custom view (next,previous) which helps to navigate through the views.
When I reach the 2 view with the help of next button, I make the previous button enabled and visible. So if I press the previous button at this point the 1st view will be swapped in and I make the previous button transparent and enabled.
At this point if you press the next button to navigate to second view, the 2nd view will be swapped in and the previous button is displayed again. But it is highlighted here. How can I get rid of this?
I hope you will get some better answers, but a general technique that I have found to work in cases like this is to wait with enable/disable actions until things have settled down for the new configuration of the views.
After all (if I have read your description correctly), you are hiding a button in the middle of its own action handler.
Postponing this is easily obtained by dispatching your enable/disable code on the next (or, more correctly, a later) invocation of the run loop of the main thread:
dispatch_async(dispatch_get_main_queue(), ^{
// Enable or disable your buttons here.
});
As a solution it is somewhat of a hack, but on the other hand, waiting until your main view is no longer in a state of flux before you re-configure your navigation UI is not a bad approach.
When enableCellNavigation is enabled, the initial click and double-click on my grid immediately scrolls the page down so that the clicked row is at the top of the screen. This is quite annoying since it is not expected. Is there some way to turn this off? If enableCellNavigation is disabled, rows cannot be selected so this is not an option.
You are looking for focusOnCurrentCell()
In my case grid was scrolling to the end horizontally when clicked.
Commenting the focusOnCurrentCell() inside the function setSelectedCell(newCell,editMode) solved my problem.