I have as question mark icon with hover text attached. If the user puts their mouse over the icon and waits a second, the hover text shows up. However, if the user gets impatient and clicks on the icon, nothing happens, ever.
How can I make it so the hover text shows up on a hover or on a click?
Thank you,
Greg
Currently you use "title" property to show a tooltip. If you add a click event, you run the risk of showing two "tooltips" at the same time. The clean solution is not to use "title" property at all and use a PopupPanel instead with a simple MouseOver handler:
myWidget.addDomHandler(new MouseOverHandler() {
#Override
public void onMouseOver(MouseOverEvent event) {
myTooltipPopupPanel.showRelativeTo(myWidget);
}
}, MouseOverEvent.getType());
Obviously, if you can add a MouseOverHandler directly to myWidget, there is no need to add it as a DomHandler.
Related
Using ag-Grid Community and Angular, I set [enableCellTextSelection]="true" to enable cell text selection to facilitate copy-paste, but I found that the cellClicked event still fires when text is selected and the mouse button is released (i.e. the mouse is clicked, dragged and released in the same cell).
Is there a way to detect that text is selected in the cellClicked event and "cancel / quick exit" it?
I looked for a way to distinguish between the mouse down and mouse up coordinates but couldn't find anything...
Thanks.
Version in use
ag-grid-angular: 23.2.1
ag-grid-community: 23.2.1
Here's a little workaround you can use. Use window.getSelection() to get the text selected by the user. From this, you can determine if text has been selected or not.
Change your cellClicked callback function to this:
cellClicked(event)
{
if (window.getSelection().type !== 'Range')
{
//text has not been selected, the cell has been clicked
console.log('cellClicked');
}
}
Demo
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 strange problem..
I want to do this:
I have a focuspanel. In default I want to give him focus:
this.setFocus(true);
I have function onBlur which is able to save all information from focuspanel. But the focus panel doesn's have focus... I must click on him, and in other place to start function onBlur..
Second problem is a... When I have focus and I click on other widget in my focus panel I lose focus.. (Which I have from click on this panel.) It is not expect.
Only way to save information is to fill it in the focus panel, click on the blank space in focus panel and in other place out focus panel.. I don't know how to fix it..
Please, help!
A FlowPanel is a div and can't have focus by default, you need to set the tabindex: https://stackoverflow.com/a/3656524/66416
Concept
When a user clicks a removeUser label, a text box pops up. Then, the user enters the username of the user they'd like to remove. Then, the user hits "Enter" to remove the user.
GWT Problem
I'm working with a class that implements an object of type, com.google.gwt.user.client.ui.Composite.
One of its fields includes a #UiField Label:
#UiField
Label removeUser;
And I've got a regular TextBox that should appear when the removeUser Label gets clicked.
private TextBox removeUserTextBox = new TextBox();
If my code is correct, then the removeUserTextBox will appear when removeUser gets clicked.
removeUser.addClickHandler(new ClickHandler()
{
public void onClick(final ClickEvent event)
{
removeUserTextBox.setVisible(true);
removeUserTextBox.setText("blah blah")
removeUserTextBox.addStyleName(StaticResourceBundle.
INSTANCE.coreCss().removeUserTextBox());
}
});
However, the removeUserTextBox does not show up when I click the removeUser label.
I don't think (or know) if it's a CSS problem since removeUserTextBox's CSS is similar to removeUser's CSS, which appears correctly.
Please advise.
Thanks,
Kevin
Why are you adding a style to the textbox in the handler? Simply setVisible(true) on click, and then setVisible(false) when a user confirms the deletion.
It seems like your textbox is not attached to the DOM. You may do either of following.
1) Include a textBox in a markup (uiBinder) and inject it with a #UiField annotation.
2) Add a textBox created with constructor to the RootPanel or other container which is already attached to the DOM.
3) Wrap a textBox into a popup panel and show it relative to a label. I like this variant most because there is no need in positioning with css.
Is it possible to show a popup only in a certain gwt tab or a panel in that tab?
I've found methods to show a popups over the whole page, but not only in specific tabs.
When you switch the gwt tab, the popup should not be visible anymore and new popups should be able to be created, which again are only visible in the switched to gwt tab. Switching back to the other tab should then show the first popup again.
Optionally the rest of the tab, which is not covered by the popup, should not be clickable.
Are there any native methods for this? The gwt Popup Panel only seems to create popups for the whole page.
Edit: I've tried using smartgwts Window which seems to work just the way I want it to. When I switch the gwt-tab, the popup is no longer visible and returns when I switch back. The only problem is, that it isn't displayed right. The frame is placed on the far left side of the browser tab, while the content is displayed on the far left of the gwt-tab. If I move the content, the frame moves too. The frame is visible over the whole browser tab, while the content disappears if I drag it over the gwt-tab edge.
I guess it's because I'm adding a Window to a gwt-Panel. Is there any way to fix this without changing everything to smartgwt?
Not exactly, I think.
But, you can do something in the tab events, like hide the popup in tabs that it doesnt belongs. To avoid the lag of show/hide the popup, you can do this in the BeforeSelectionHandler, like this:
getView().getTabPanel().addBeforeSelectionHandler(new BeforeSelectionHandler<Integer>()
{
#Override
public void onBeforeSelection(BeforeSelectionEvent<Integer> event)
{
showPopupupsForTab(event.getItem());
}
});
In showPopupupsForTab you can show the popups for this tab (you can handle this with a map or something) and hide the others...
Something like this.
Hope it helps.