[Vuejs]-How can I disable my submit button when a text area is left blank?

by

0👍

You can just check with Logical NOT (!) operator which takes truth to falsity and vice versa. Hence, If there will be no value in the textarea it will return false else true.

Working Demo :

new Vue({
  el: '#app',
  data: {
    content: ''
  }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
  Textarea content: {{ content }}
  <br><br>
  <textarea v-model="content"></textarea>
  <button id="submitButton" :disabled="!content.trim()">
    <span>Submit</span>
  </button>
</div>

I just added an example to show you how to achieve. You can made the changes in your original code.

Leave a comment