Mengseng Oeng
Mengseng Oeng

Reputation: 813

Vue Js - How to disable all inputs after loaded data

I have many inputs on my forms. After I got data from API, I looped to display all inputs. Then I want to disable them. I do not want to disable all inputs one by one on my loop, because I had many loops and inputs on my forms. I want to write a block of code can solved my problem.

I try to use this code for disable them, but it can only disabled on input that created before load data.

let inputs = document.getElementsByTagName('input')
for(let i = 0; i < inputs.length; i++) {
   inputs[i].disabled = true;
}

Thanks!

Upvotes: 1

Views: 1007

Answers (1)

Ashwin Bande
Ashwin Bande

Reputation: 3073

if you are using vue.js then you can set a veriable like disable and set it like this

<template>
<input type="text" :disabled="disable">
<input type="text" :disabled="disable">
<input type="text" :disabled="disable">
.
.
.
</template>

and in vue script

data() {
   return {
   // other vars,
   disable: false,
   }
},
methods: {
   methodToLoadData() {
    // Load data
    this.disable = true;
   },
},

Upvotes: 2

Related Questions