Best posts made by Raph

I found a way to make it work by testing… but it is really weird ???

this.$refs.studentName.focus();

doesn’t work…

But if I write 2 times…

this.$refs.studentName.focus();
this.$refs.studentName.focus();

It works ???

Can someone explain me how is it possible ???

Thanks again.

EDIT : Damned, if I launch it from an other button (from a Q-dialog)… It doesn’t work anymore !

<q-input outlined class="col" type="text" v-model="student" ref="studentName" placeholder="Nom de l'élève" style="margin-right : 20px">
    <template v-slot:prepend>
       <q-icon name="person" />
    </template>
</q-input>


<q-btn-group class="col">
    <q-btn color="primary" @click="confirmTestFocus = true" label="Charger les copies" icon="refresh" class="col" />
    <q-btn-dropdown outline auto-close color="primary" icon="menu">
        <!-- dropdown content goes here -->
        <q-list padding style="width: 250px">
            <q-item clickable @click="testFocusSUCCESS">
                <q-item-section avatar>
                    <q-avatar icon="folder" color="primary" text-color="white" />
                </q-item-section>
                <q-item-section>
                    <q-item-label>Ouvrir le dossier temporaire</q-item-label>
                </q-item-section>
            </q-item>
            <q-separator inset />
        </q-list>
    </q-btn-dropdown>
</q-btn-group>

<q-dialog v-model="confirmTestFocus" persistent>
    <q-card>
        <q-card-section class="row items-center">
            <q-avatar icon="refresh" color="primary" text-color="white" />
            <span class="q-ml-sm">Attention, toutes les associations actuelles seront supprimées !</span>
        </q-card-section>
        <q-card-actions align="right">
            <q-btn flat label="Annuler" color="primary" v-close-popup />
            <q-btn @click="testFocusFAIL" label="Charger les copies" color="primary" v-close-popup />
        </q-card-actions>
    </q-card>
</q-dialog>


testFocusSUCCESS () {
    this.$refs.studentName.focus();  
    this.$refs.studentName.focus();
}

testFocusFAIL () {
    this.$refs.studentName.focus();  
    this.$refs.studentName.focus();
}

I really don’t understand… ?

@dnix Thank you, this worked for me.
@metalsadman With or without $el, it is the same result.

Thanks for your help. I really enjoy playing with Quasar !