CODEWITHSUNDEEP
react-native
srb633
srb633

Reputation: 813

Dynamically display an unchangeable character at the end of a text input in React Native?

I'm trying to restrict the user to only ask a question inside of a text input. To achieve this I was thinking of finding a method in which a constant character can be displayed at the end of every character the user types in the text input. I'd want that character to be a question mark. So for example, as the user types something like this;

why does this

why does this mean this

why does this mean this blah blah blah

It would display a question mark ? at the end of their text input dynamically.

why does this?

why does this mean this?

why does this mean this blah blah blah?

So as they type, the question mark is always displayed at the end of their text input and they can't remove it nor interact with it in anyway. The text input forces them to ask a question.

I thought it would be as easy as placing a text component in front of the text input component, but doing that just renders the question mark statically, it wouldn't actually follow the user's keystrokes as they type the question. I'd certainly want the question mark to be displayed dynamically. Are there any native properties in the text input component that allow for such a task?

Cheers.

Upvotes: 0

Views: 546

Answers (1)

Imjaad
Imjaad

Reputation: 604

From my experience you can use onSubmitEditing and onBlur methods of the TextInput component and listen for the event when user has finished writing then you can write a function to append '?' mark at the end of the string and update whatever you want.

Upvotes: 1

Related Questions