CODEWITHSUNDEEP
quasar-framework
neubert
neubert

Reputation: 16802

adding an id attribute to q-input

Say I have the following q-input:

<q-input
    v-model="form.email"
    inverted-light
    color="white"
    stack-label="Email:"
    type="email"
    @blur="$v.form.email.$touch"
    :error="$v.form.email.$error"/>

I'd like to be able to make it so that if the domain of the email is mydomain.com that the form action will change to another website (without csrf protection) and the POST will be made to that website instead of the main one.

To do this I was thinking I could use jQuery. eg. $('#email').val().replace(/^.+@/, '') == 'mydomain.com' then change the form action and submit.

The only problem is: I don't know how to set an id attribute on q-input.

Any ideas?

Upvotes: 4

Views: 4576

Answers (2)

MiBol
MiBol

Reputation: 2125

Not using the "for" in the elements gave me a lot of headaches because the Jest snapshot generated random IDs

Upvotes: 1

J.P.
J.P.

Reputation: 176

As of early Quasar 1.4.2 (November of this year) you can specify the id value on the resulting html generated by q-input by using the "for" property (see the end of the behavior properties: https://quasar.dev/vue-components/input#QInput-API).

So, for example, you could add for="myInputId":

<q-input
    v-model="form.email"
    inverted-light
    color="white"
    stack-label="Email:"
    type="email"
    @blur="$v.form.email.$touch"
    :error="$v.form.email.$error"
    for="myInputId"
/>

The id attribute with value "myInputField" will end up on the resulting <input> element in your HTML.

Upvotes: 14

Related Questions