screen_rotation
Copied to Clipboard
<html> <head> <script type="importmap"> { "imports": { "vue": "https://unpkg.com/vue@3/dist/vue.esm-browser.js" } } </script> </head> <body> <div id="app"> <h3>Vue Js Allow only Alphabets in Textbox</h3> <textarea type="text" @input="validateInput"></textarea> <pre v-if="errorMessage" style="color:red">{{ errorMessage }}</pre> </div> <script type="module"> import { createApp } from "vue"; createApp({ data() { return { errorMessage: '', } }, methods: { validateInput(event) { const regex = /^[a-zA-Z]+$/; if (!regex.test(event.target.value)) { event.target.value = event.target.value.replace(/[^a-zA-Z]/g, ''); this.errorMessage = 'Please enter alphabetic characters only.'; } else { this.errorMessage = ''; } }, } }).mount("#app"); </script> </body> </html>