Notice: The Monaca & Onsen UI Community Forum is shutting down.
For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.
Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.
v-ons-input inside v-ons-alert-dialog losing focus after entering a single text
-
I’m trying to create a login dialog with v-ons-alert-dialog and v-ons-input.
However, v-ons-input loses its focus whenever I enter a single text. I have no idea of what’s wrong.
I’d like to just create a login dialog so if you think I’m going the wrong way, any suggestions are appreciated.Frameworks: Onsen UI 2 + Vue.js 2
Here is my tested code:
(The code is originally coming from https://onsen.io/v2/docs/vue/v-ons-dialog.html )<v-ons-alert-dialog :title="'Please login'" :footer="{ Login: () => alertDialog2Visible = false }" :visible="alertDialog2Visible" @update="alertDialog2Visible = $event" > <v-ons-input float type="text" maxlength="20" placeholder="username" v-ons-model="username" ></v-ons-input> <v-ons-input float type="password" maxlength="20" placeholder="password" v-ons-model="password" ></v-ons-input> </v-ons-alert-dialog>
new Vue({ el: '#app', template: '#main', data() { return { username:'', password:'', alertDialog2Visible: false }; } });
-
@dbaba can you replicate that in the tutorial app you got the code from? It’s working fine for me.
-
@misterjunio Thank you for the reply. I tried again there but the input boxes still lost the focus after entering a single character.
For instance, when I tried to enter “abcd” to the username input text, the text box just accept only the first char ‘a’. In order to share the behavior, I’ve created a codepen snip. could you please have a look at this? and try to enter 2 or more length text to username or password boxes.https://codepen.io/anon/pen/XRjXvY?&editors=101
I’m using Chrome, Safari and Firefox on macOS Sierra.
-
@dbaba The issue is related to a new feature in
beta.2
. You can continue withbeta.1
for now and we will try to releasebeta.3
with this fixed asap.
-
I fixed this in gh#1972. I’ll release
beta.3
tomorrow including this fix :thumbsup:
-
@Fran-Diox Thanks! Let me check after the release.
-
@dbaba Released! Your codepen now works if you load
beta.3
(make sure your browser is not cachingbeta.2
).
-
@Fran-Diox Great! I will close the thread. Thank you!