Get TextField text property after keyboard done in nativescript

Question

I have a TextField and want to listen to the event when the user finished typing and wants to go on. I neither want to call a function each time a user presses any key nor I want to add a submit button. The keyboard offers a 'done' button, so why don't use this. The only question which follows is how to listen to that specific event.

score 2 · Accepted Answer · answered May 04 '17 at 11:08

2

returnPress should do what you want:

<TextField (returnPress)="returnPress()"

answered May 04 '17 at 11:08

Günter Zöchbauer

623,577
216
2,003
1,567

Do I have to pass an event as parameter or should I use `@ChildView` to access the text property? – shaedrich May 04 '17 at 11:32
You can use `[(ngModel)]="myProp"` to be able to get the content from `this.myProp`. Actually not sure, there might be a timing issue. You can try ` – Günter Zöchbauer May 04 '17 at 11:33
Okay, that was easy :D Thank you. – shaedrich May 04 '17 at 11:34
To pass the value did not work, but getting the property from the model does. – shaedrich May 04 '17 at 11:48
I can't figure out why, but the value passed is an empty string all the time in that case. – shaedrich May 04 '17 at 11:51
empty string ... when passed what way? Can you please add the code to your question? – Günter Zöchbauer May 04 '17 at 11:53
When doing `` in the template and `returnPress(txt: string) { console.log(txt); }` in the component, I got only an empty string. – shaedrich May 04 '17 at 11:56
but `this.myProp` does have the value? According to the [docs](https://docs.nativescript.org/cookbook/ui/text-field) it probably should be `"returnPress(tf.text)"` (`text` instead of `value`) – Günter Zöchbauer May 04 '17 at 11:57
Using the model is the preferred way anyway. – Günter Zöchbauer May 04 '17 at 11:59
Well, okay. Then I should do it this way. Thanks again. – shaedrich May 04 '17 at 12:00

score 2 · Answer 2 · answered May 04 '17 at 17:40

With NativeScript 3 you can use the new blur event. That way you will not only call a function when the Enter key is pressed, but also when the user leaves the field by other means (tap a different field for instance).

See the API reference here https://docs.nativescript.org/api-reference/classes/_ui_text_base_.textfield.html#blurevent

Example:

<TextField (blur)="userLeftTheField()">

Get TextField text property after keyboard done in nativescript

2 Answers2