When hover over jquery autocomplete list items, the items are selected automatically, how to avoid this behaviour.
Avoid mouse over selection
$("#foo").autocomplete({focus:function(e,ui) {
return false;
}});
Related
The AutoComplete widget will automatically popup the dropdown list every time you clicked in the textfield. The problem is the popup cannot be dismissed unless you deliberately input some wrong words or select one item in the popup list. This leads to unwanted result.
You can check this behavior in this dartpad or on the official document.
I expect the popup can be dismissed by hitting the esc key or clicking outside the popup, so that I can see the import thing underneath.
Has I missed something or it's simply a bug?
from source code , they are three conditions to show a options view
bool get _shouldShowOptions {
return _focusNode.hasFocus && _selection == null && _options.isNotEmpty;
}
it seems that unfocus the underlying textfield is the simplest solution
We use ag-grid and I need to control the way context menu items are being generated based on mouse and keyboard events. In this case I need to add an optional context menu item if alt+right click are pressed (rather than just right click). Simply binding event listeners on our end does not help because the context menu items are being bound before the event listener is being fired so I can't check if the user pressed them.
Any advise will be appreciated.
As per documentation Configuring the Context Menu, you can provide context menu items using gridOptions.getContextMenuItems function. Here you can find if Shift or Ctrl is pressed or not.
if(this.event.altKey === true) {
result.push({name: 'Alt key is pressed', disabled: true});
}
if(this.event.shiftKey === true) {
result.push({name: 'Shift key is pressed', disabled: true});
}
Have a look at this plunk I've created: Context Menu Example
Based on the key you press while doing mouse right click, one item is getting added to the context menu.
I have a disabled button. On mouse hover of this disabled button, I need to display a popup using GWT.
I tried to wrap it inside a panel and coded mouse hover for the panel. But it's not working instantly all the time.
IMO you should try to avoid this situation. For example, if you just want to show a small tooltip you can use a different title for enabled and disabled state explaining the disabled cause.
If you still want to react to an over event on disable button you can use something like this.
SimplePanel p = new SimplePanel();
Button b = new Button("hover me to toggle disable"); p.add(b);
p.addDomHandler(ev -> button.setEnabled(!b.isEnabled()), MouseOverEvent.getType());
RootPanel.get().add(p);
Although as you already have noticed, the browser does not fire over events on disabled inputs. So if you move the mouse without passing through the panel and goes directly to the button you will not receive the event. You can fix this applying this style.
button.gwt-Button[disabled] {
pointer-events: none;
}
But probably this might have some downsides or might not work in all browsers.
I have a survey with many input elements, and I have a progress bar that shows how much of the survey that has been filled out/answered by having a click event on the input elements. This works fine until someone use tab control to navigate through the form. Is there a tab control event, or some other event that I can use to track this behaviour?
Use the event focus to capture when the user is tabbing around in your controls:
$.on("focus", "input", function() { });
I'm trying to do a sort of temporary form autocomplete on mouse over of a combobox item. My combobox has a remote store and I would that on item hover the other fields of the form are compiled with the other information from combo store while the mouse is on an item. There isn't a mouseover event for comboboxes items so how can I do it?
You can attach a mouseover listener to the div element that is wrapping the combobox like so:
myCombo.bodyEl.on('mouseover', function(e, t, eOpts) {
//Do something
});