I have a kendo ui grid which has an incell editing mode.
Required is when altering a value in a cell and pressing anywhere else a confirmation window to appear to save/cancel the change.
Right now i have managed to make it partially work. In other words when i change a value and press somewhere on the web page or a button i get the confirmation window as requested.
When i press on another cell nothing happens. The pressed cell gets in edit mode, the "edit" function is fired but the previous cell loses its value and the binded function is never called.
So in a few words, i need to call my confirmation function every time a value is changed and the user presses anywhere else. Right now it partially works. It seems that the function is not fired when pressing on another cell.
My source right now is like that.
edit: function(e) {
e.model.unbind("change", confirmationFun).bind("change", confirmationFun);
}
function confirmationFun(e){
// open confirmation dialog and call save function
}
I tried to combine my confirmation with the change: function(e) but the change is fired every time i press on a cell, even before i change a value.
Instead of using edit event, you might use blur. After the initialization of your grid add the following command that binds any blur to your confirmationFun function.
$('#grid').on("blur", "input", confirmationFun);
Where grid is the id of your KendoUI grid.
The problem was finally resolved by removing the selectable: "multiple cell"
part from my code. Now by pressing on a different cell i get the confirmation dialog as required.
Thank you.
Related
I need the ability for a user to press and set an ListView item's checkbox independently of clicking on the item. If they press on the checkbox I will add/remove the checkmark and take some action. If they press on the item text I can take another action.
I can do this with a ListBox no problem with built in functionality. I can't figure out how to do it with a ListView. How is it done?
I can put the following code in the ListView1ItemClickEx to know when the user is clicking on the image. Maybe I can just change the image to a checkmark?
if (ItemObject->Name == "I") {
ShowMessage("Item Image clicked");
}
But I don't know how to change that particular items image (e.g. I could just toggle between a checkmark image and an unchecked image) at runtime.
The picture below is for clarity. Clicking anywhere in the red box will change the items checkbox. For the ListBox clicking anywhere in the blue box will fire the OnClick event and not change the checkbox. I want that same behavior in the ListView.
Ok, Remy answered this related question and it helped me solve this issue. Now I can make the ListView have a checkbox that functions like that of the ListBox. I do it by toggling the item image whenever the user presses (or clicks on) the image area of an item.
When the user clicks an items image I trap it (per Remy's code in the ListView1ItemClickEx event) and toggle it from 0->1 or 1->0 in a vector at reference ItemIndex (e.g. myVector[ItemIndex] = 0) and then I completely rebuild the ListView (clear it and build from scratch).
I thought I'd have to remember where in the list I had scrolled down to and after refreshing the ListView I'd have to scroll to that point in code - but, that isn't the case. I don't know why but after the refresh I'm still at the point in the list where I clicked an item image. It makes it work and feel exactly like a check box.
It works great in iOS, Android, and Windows.
p.s. I forgot to mention that you need to treat any Header's like they are items in your vector that keeps up with each items' image (0 or 1). Otherwise adding headers gets you out of sync and clicking an item's image will toggle some other item's image.
It took me a while to figure out the problem with Unity UI Button Transition:
Problem:
I hover on the button object, it goes to highlighted state, that's Fine. If I press mouse on button and it goes to pressed state then I move mouse outside of button so its no longer over button. The button goes to highlighted state instead of normal state. I need to click in empty space to get the normal state of button.
TLDR:
To retain keyboard automatic navigation, you probably want to inherit from IPointerExitHandler and deselect on exit:
public void OnPointerExit(PointerEventData data)
{
EventSystem.current.SetSelectedGameObject(null);
}
You could add checks to only deselect gameObject if already selected.
This is the default behaviour for a Button element in Unity - it retains focus after the initial interaction, causing it to show the Highlighted Color. Clicking away clears the focus, so it no longer becomes highlighted then.
To change this behaviour, you can switch the Navigation setting.
Currently, it's set to Automatic. According to the documentation, the option you want to use instead is None, which results in:
No keyboard navigation. Also ensures that it does not receive focus from clicking/tapping on it.
Hope this helps! Let me know if you have any questions.
If you want to use keyboard navigation and also get rid of this problem you can add this function to update:
void Update()
{
if (Input.GetMouseButtonUp(0))
{
EventSystem.current.SetSelectedGameObject(null);
}
}
In my application I have a multi step form wizard in which
the next button is disabled unless all the required fields are entered.
Some fields require extra validation such as the directory picker,
for which I have to check whether the directory exists or not.
To ease the user experience I need to show an "Invalid directory" tooltip
next to the directory text field.
I would like to show the tooltips when the user tries to click/enter the disabled
next button.
Is it possible to capture events performed on a disabled button in JavaFX?
public void nextEntered(Event event) {
Button button = (Button)event.getSource();
if(button.isDisabled()){
validate(currentTab);
}
}
I had a similar problem where I wanted to show a tooltip of a disabled field's value when the user moused over that disabled field.
I ended up putting a blank label over the disabled field and attaching a mouse event to that.
In the case of a button, you can just give the dummy label mouse transparency when the button becomes enabled so the user can click the button.
(You might even be able to bind the label's mouse transparency property to the button's enabled property but I'm not sure.)
I know this was asked a year ago but maybe it will help someone else.
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 have a SlickGrid with some Editors on a form with some buttons above it. (Save and Cancel). When i edit a cell in the grid and click the buttons above the grid - the cell does not commit it's edit. I've debugged and it is not calling : commitCurrentEdit. I've also tested on clicking an empty area anywhere out of the grid area...
Has anyone noticed this scenario and have a solution to get the cell to commit when one clicks out of the grid. Due to the various positions the grid good be in it would be hard to do an overlay.
Thanks
You can try this:
$("#buttonName").bind("click", function(){
gridName.getEditController().commitCurrentEdit()
});