i have a TextBox which is used for searching products in my app. This TextBox should do searching after user key in keywords to the TextBox or when user hits ENTER.
to be able to explain further, this TextBox worked like the Google's search box wherein search results are viewed instantly after user input.
i have tried the ValueChangeHandler but the event will only fired if the TextBox loses its focus. i also tried KeyPressEventHandler but i want to only fire the search event after user key-in the keyword, not on every key press. can anyone give me an idea on how to do this?
i was thinking of using the GWT Timer to fire the search event after a certain time. the timer would only run if user no longer key-in keys to the TextBox but how will i know if no KeyPressEvent is fired?
This works for me :
#UiHandler("searchBox")
public void onKeyUpEvent(KeyUpEvent keyPress) {
// do the search
}
You need KeyUpEvent, KeyPressEventHandler will always be late...
Use KeyPressEventHandler or KeyUpEventHandler and check whether the last typed character equals a whitespace. I think you can receive the key, which fired the event, from the event object. Otherwise use the getText() methode of the TextBox. Do only update the search results when you detect a whitespace or ENTER. I know this doen't solve the problem if the user stops typing after a word :-)
I checked in the handler code of the pressed key, and depending on it to perform some action.
searchQueryTextBox.addKeyUpHandler(new KeyUpHandler() {
#Override
public void onKeyUp(KeyUpEvent event) {
if (event.getNativeKeyCode() == 13 || event.getNativeKeyCode() == 32) {
//run a search. code 13 - key "Enter", code 32 - key "Space"
}
}
});
Related
I'm using an Input Field in a Unity 3D game. When I enter text on my Windows 10 Mobile, and push the back button to dismiss the keyboard, Unity thinks I want to clear the Input Field. This behavior is not even mentioned in the documentation and I have not found a way to override it. I'd like to make it so the user can use the back button to dismiss the keyboard without reverting the Input Field. Any suggestions? Is this just a bug with Unity?
You can see the source code of InputField here: https://bitbucket.org/Unity-Technologies/ui/src/0155c39e05ca5d7dcc97d9974256ef83bc122586/UnityEngine.UI/UI/Core/InputField.cs?at=5.2&fileviewer=file-view-default
Apparently, clearing the field on escape is made by design. look at line 980 - 984:
case KeyCode.Escape:
{
m_WasCanceled = true;
return EditState.Finish;
}
What you can try is to create your own subclass of InputField and override the function
protected EditState KeyPressed(Event evt)
Of course it is not really clean, since you'll have to copy everything that the base InputField does in this function, except for lines 980 - 984.
The function KeyPressed cant be overridden.
I just added that in my function that listens on the value changes of the inputField:
if (Input.GetKeyDown (KeyCode.Escape)) {
return;
}
And it does exactly what is necessary :)
What am I trying to do?
I have an existing page (generated by system automatically and I don't have any control on it) in which I am injecting GWT code to modify the behaviour of the page after it loads based on certain columns and augment the functionality of the page. For example after adding my GWT code, cells in one of the table columns become clickable and when the user clicks it, additional information is displayed to the user in a pop-up panel. All that is working fine.
What is the issue?
The generic page in which I am injecting my code has paginated table which shows 15 rows at a time. Now, when I load/refresh the page, my GWT code kicks in and sinks events in the specific column which adds functionality (described above) to the cells. However, when the user uses the left and right buttons to navigate the paginated result, the page does not refresh as it is an asynchronous call. The specific column in the new set of 15 rows is now without the sunk events as the GWT code does not know that the page changed.
I am trying to find a way to tell my GWT code that page has changed and it should sink events to the cells of specific column for the new 15 rows but unable to find any method or mechanism to help me capture a DOM/Document change event. I tried doing this but did not help:
new ChangeHandler(){
#Override
public void onChange(ChangeEvent event) {
Window.alert("Something Changed");
}
It is possible I am missing something very obvious. Posting this question to know if there is an easy way to figure out DOM changes in GWT. Have searched for DOM/Document change/mutation/ etc. without luck.
If anyone knows how to detect DOM changes in GWT would really appreciate otherwise would go ahead writing native code using native mutation observers.
You can try something like this:
First get the input elements with:
InputElement goOn = DOM.getElementById("IdOfGoOnButton").cast();
InputElement goBack = DOM.getElementById("IdOfGoBackButton").cast();
Next add a native EventHandler:
Event.addNativePreviewHandler(new Event.NativePreviewHandler() {
#Override
public void onPreviewNativeEvent(Event.NativePreviewEvent event) {
if (event.getTypeInt() == Event.ONCLICK) {
if (event.getNativeEvent()
.getEventTarget() != null) {
Element as = Element.as(event.getNativeEvent()
.getEventTarget());
if (as.getTagName()
.toLowerCase()
.equals("input")) {
InputElement clickedElement = as.cast();
if (clickedElement.getId().equals(goOn.getId()) ||
clickedElement.getId().equals(goBack.getId())) {
// one of the paging button is pressed
}
}
}
}
}
});
Hope that helps.
I have an issue trying to persist entities to the DB using code-first technique. For example of what I am doing you may look at the following MSDN Sample. The app generally works as intended except for one case.
If I have an existing entity and I bind it to a page that has a TextBox to hold the Title field and a AppBar icon to Save (similar to the 'New Task' screenshot in the above link, but with values pre-filled with existing entity with Two-Way binding), the following issue occurs. If I have the TextBox selected and I change the title and hit the save button, it updates the entity in-memory so that the full list now displays the new title. But the new title is not persisted to the DB (it does not auto-detect changes). This is weird, not just because the object in-memory has changed, but also because if I deselect the TextBox and then hit save, it will persist the changes to the DB.
I have seen other questions on SO with some change detection issues, they suggest adding this.Focus() or focusing some other element at the beginning of the save method. This does not help in my case. Unless I tap on screen to deselect the TextBox and hide the keyboard (or press Return key on the keyboard, which I bound to do this.Focus()), it won't detect the object as changed.
How can I address this? What exactly is stopping EF from detecting the object change when the keyboard is still visible?
Not sure if I follow exactly what you described but I think the problem is that the property you have bound your textbox to does not get updated until the TextChanged is fired on the textbox, and this is done first when you leave the Textbox, basically it will lose Focus if you tap somewhere else.
There is a simple workaround for this and it behaviors. By making a small behavior you can force the textbox to update the binding on each keystroke - so everything is updated while you type and keyboard is still there.
Behavior:
/// <summary>
/// Update property on every keystroke in a textbox
/// </summary>
public class UpdateTextSourceTriggerBehavior : Behavior<TextBox>
{
protected override void OnAttached()
{
this.AssociatedObject.TextChanged += OnTextBoxTextChanged;
}
void OnTextBoxTextChanged(object sender, TextChangedEventArgs e)
{
var bindingExpression = AssociatedObject.ReadLocalValue(TextBox.TextProperty) as BindingExpression;
if (bindingExpression != null)
{
bindingExpression.UpdateSource();
}
}
protected override void OnDetaching()
{
this.AssociatedObject.TextChanged -= OnTextBoxTextChanged;
}
}
Now just attach this behavior to your textbox like this:
<TextBox Text="{Binding YourPropertyName, Mode=TwoWay}">
<i:Interaction.Behaviors>
<UpdateTextSourceTriggerBehavior/>
</i:Interaction.Behaviors>
</TextBox>
This will keep the property on your viewmodel updated all the time, so that when you tap on save directly after typing in the textbox it will save the correct value. Hope it helps!
Cheers,
Anders
I have a Suggest box which has 2 hadlers: SelectionHandler for selecting items in SuggestionList and keyDownHandler on TextBox of SuggestBox. I want to prevent default action on event(for example on Enter pressed) when the suggestion list is currently showing. The problem is that SelectionEvent is always fires before KeyDownEvent and suggestion list is closed after SuggestionEvent fired, so in KeyDownEventHandler suggestion list is already closed. And I can't use prevent default action on Enter with checking the suggestion list is showing like this:
if ((nativeCode == KeyCodes.KEY_TAB || nativeCode == KeyCodes.KEY_ENTER) && display.isSuggestionListShowing()) {
event.preventDefault();
}
where display.isSuggestionListShowing() is the method which calls isShowing on SuggestBox .
So how can i change the order of event handling(Selection before KeyDown to the keyDown before Selection) in this case?
I'm assuming you mean SuggestBox instead of SuggestionList, as there is no class by that name in the gwt-user jar.
The SuggestBox uses the keydown event to provide the SelectEvent - if it can't see the keys change (from the browser, which actually picks up the user's action), it can't provide the logical selection event.
This means that reordering events doesn't really make sense - you can't have the effect before the cause. In many cases, the browser emits events in a certain order, and there is no way to change this, so you have to think differently about the problem.
(Also worth pointing out that preventDefault() only prevents the browser from doing its default behavior - other handlers will still fire as normal.)
One option would be to preview all events before they get to the SuggestBox, and cancel the event in certain cases - look into com.google.gwt.user.client.Event.addNativePreviewHandler(NativePreviewHandler) for how this can be done.
I'm not seeing any other option right away - all of the actual logic for handling the keydown is wrapped up in the inner class in the private method of com.google.gwt.user.client.ui.SuggestBox.addEventsToTextBox(), leaving no options for overriding it.
In the tinyMCE init editor,
How can i in setup do:
ed.onKeyDown.add(function (ed, evt) {
// alert the character you just typed
});
Say if you type "a" a alert should come up with "a"
The evt.keyCode property contains the code of the pressed key, so you can do this:
alert(String.fromCharCode(evt.keyCode));
Note, however, that this will also trigger an alert when a special key is pressed (e.g. shift), so you might want to prevent that by checking other properties of the evt object (which is an instance of DOM Event). See the documentation for keyboard event objects at https://developer.mozilla.org/en/DOM/KeyboardEvent.
Edit: Use onKeyPress instead of onKeyDown, as onKeyDown might return incorrect key codes in some browsers.