How to clear focus from an inputfield in React Native?
I have an inputfield and I want to get rid of the focus on it, after i click the submit button.
Any suggestions on how I would go about this?
react-native
asked Aug 30 '16 at 11:23
Henkav141
4113
add a comment |
I have an inputfield and I want to get rid of the focus on it, after i click the submit button.
Any suggestions on how I would go about this?
react-native
asked Aug 30 '16 at 11:23
Henkav141
4113
add a comment |
I have an inputfield and I want to get rid of the focus on it, after i click the submit button.
Any suggestions on how I would go about this?
react-native
asked Aug 30 '16 at 11:23
Henkav141
4113
I have an inputfield and I want to get rid of the focus on it, after i click the submit button.
Any suggestions on how I would go about this?
react-native
react-native
asked Aug 30 '16 at 11:23
Henkav141
4113
asked Aug 30 '16 at 11:23
Henkav141
4113
asked Aug 30 '16 at 11:23
Henkav141
4113
asked Aug 30 '16 at 11:23
Henkav141
4113
asked Aug 30 '16 at 11:23
Henkav141
4113
4113
add a comment |
add a comment |
3 Answers
3
active
oldest
votes
You can add ref to your text input: <TextInput ref="input"> and then call this.refs.input.blur().
answered Aug 30 '16 at 11:39
Radek Czemerys
720315
1
I like the idea, but that does only work if you have some kind of input or if you have isFocused() method... e.g. I have a TextInput for a search field with a listview under it. If you search something and scroll the result in the listview you can't toggle the keyboard to go away
– dv3
Aug 30 '16 at 12:05
add a comment |
It may not seem like the obvious answer, but you can try the static method Keyboard.dismiss() for this.
https://facebook.github.io/react-native/docs/keyboard
I needed to remove the focus when uncertain which input might have it. This did the trick.
answered Nov 21 at 0:24
Dave Welling
34527
add a comment |
In my use case I explicitly needed the input to lose focus (and require the user to touch it again with the intent to edit).
The kludge in this blog post was what worked for me the best:
this.refs.input.setNativeProps({'editable':false});
this.refs.input.setNativeProps({'editable':true});
answered Dec 12 at 10:51
paolobueno
99958
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f39226177%2fhow-to-clear-focus-from-an-inputfield-in-react-native%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
3 Answers
3
active
oldest
votes
3 Answers
3
active
oldest
votes
active
oldest
votes
active
oldest
votes
You can add ref to your text input: <TextInput ref="input"> and then call this.refs.input.blur().
answered Aug 30 '16 at 11:39
Radek Czemerys
720315
1
I like the idea, but that does only work if you have some kind of input or if you have isFocused() method... e.g. I have a TextInput for a search field with a listview under it. If you search something and scroll the result in the listview you can't toggle the keyboard to go away
– dv3
Aug 30 '16 at 12:05
add a comment |
You can add ref to your text input: <TextInput ref="input"> and then call this.refs.input.blur().
answered Aug 30 '16 at 11:39
Radek Czemerys
720315
1
I like the idea, but that does only work if you have some kind of input or if you have isFocused() method... e.g. I have a TextInput for a search field with a listview under it. If you search something and scroll the result in the listview you can't toggle the keyboard to go away
– dv3
Aug 30 '16 at 12:05
add a comment |
You can add ref to your text input: <TextInput ref="input"> and then call this.refs.input.blur().
answered Aug 30 '16 at 11:39
Radek Czemerys
720315
You can add ref to your text input: <TextInput ref="input"> and then call this.refs.input.blur().
answered Aug 30 '16 at 11:39
Radek Czemerys
720315
answered Aug 30 '16 at 11:39
Radek Czemerys
720315
answered Aug 30 '16 at 11:39
Radek Czemerys
720315
answered Aug 30 '16 at 11:39
Radek Czemerys
720315
720315
1
I like the idea, but that does only work if you have some kind of input or if you have isFocused() method... e.g. I have a TextInput for a search field with a listview under it. If you search something and scroll the result in the listview you can't toggle the keyboard to go away
– dv3
Aug 30 '16 at 12:05
add a comment |
1
I like the idea, but that does only work if you have some kind of input or if you have isFocused() method... e.g. I have a TextInput for a search field with a listview under it. If you search something and scroll the result in the listview you can't toggle the keyboard to go away
– dv3
Aug 30 '16 at 12:05
1
1
I like the idea, but that does only work if you have some kind of input or if you have isFocused() method... e.g. I have a TextInput for a search field with a listview under it. If you search something and scroll the result in the listview you can't toggle the keyboard to go away
– dv3
Aug 30 '16 at 12:05
I like the idea, but that does only work if you have some kind of input or if you have isFocused() method... e.g. I have a TextInput for a search field with a listview under it. If you search something and scroll the result in the listview you can't toggle the keyboard to go away
– dv3
Aug 30 '16 at 12:05
add a comment |
It may not seem like the obvious answer, but you can try the static method Keyboard.dismiss() for this.
https://facebook.github.io/react-native/docs/keyboard
I needed to remove the focus when uncertain which input might have it. This did the trick.
answered Nov 21 at 0:24
Dave Welling
34527
add a comment |
It may not seem like the obvious answer, but you can try the static method Keyboard.dismiss() for this.
https://facebook.github.io/react-native/docs/keyboard
I needed to remove the focus when uncertain which input might have it. This did the trick.
answered Nov 21 at 0:24
Dave Welling
34527
add a comment |
It may not seem like the obvious answer, but you can try the static method Keyboard.dismiss() for this.
https://facebook.github.io/react-native/docs/keyboard
I needed to remove the focus when uncertain which input might have it. This did the trick.
answered Nov 21 at 0:24
Dave Welling
34527
It may not seem like the obvious answer, but you can try the static method Keyboard.dismiss() for this.
https://facebook.github.io/react-native/docs/keyboard
I needed to remove the focus when uncertain which input might have it. This did the trick.
answered Nov 21 at 0:24
Dave Welling
34527
edited Nov 21 at 0:38
answered Nov 21 at 0:24
Dave Welling
34527
answered Nov 21 at 0:24
Dave Welling
34527
answered Nov 21 at 0:24
Dave Welling
34527
34527
add a comment |
add a comment |
In my use case I explicitly needed the input to lose focus (and require the user to touch it again with the intent to edit).
The kludge in this blog post was what worked for me the best:
this.refs.input.setNativeProps({'editable':false});
this.refs.input.setNativeProps({'editable':true});
answered Dec 12 at 10:51
paolobueno
99958
add a comment |
In my use case I explicitly needed the input to lose focus (and require the user to touch it again with the intent to edit).
The kludge in this blog post was what worked for me the best:
this.refs.input.setNativeProps({'editable':false});
this.refs.input.setNativeProps({'editable':true});
answered Dec 12 at 10:51
paolobueno
99958
add a comment |
In my use case I explicitly needed the input to lose focus (and require the user to touch it again with the intent to edit).
The kludge in this blog post was what worked for me the best:
this.refs.input.setNativeProps({'editable':false});
this.refs.input.setNativeProps({'editable':true});
answered Dec 12 at 10:51
paolobueno
99958
In my use case I explicitly needed the input to lose focus (and require the user to touch it again with the intent to edit).
The kludge in this blog post was what worked for me the best:
this.refs.input.setNativeProps({'editable':false});
this.refs.input.setNativeProps({'editable':true});
answered Dec 12 at 10:51
paolobueno
99958
answered Dec 12 at 10:51
paolobueno
99958
answered Dec 12 at 10:51
paolobueno
99958
answered Dec 12 at 10:51
paolobueno
99958
99958
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f39226177%2fhow-to-clear-focus-from-an-inputfield-in-react-native%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
