Get value from textarea

[sayali saitawdekar]

How to get value from textarea? id attribute is not appended to textarea.

[Ashokkumar Balasubramanian]

Hi sayali saitawdekar, 

 

Greetings from Syncfusion support. 

 

You can get the textarea value from the component using component vue reference as mentioned in the below code example. 

 

<template> 

    <div id="app"> 

        <ejs-textbox ref="textareaObj" :created="onCreate" id="default" :multiline="true" :value="value" floatLabelType="Auto" placeholder="Enter your name"></ejs-textbox> 

    </div> 

</template> 

 

<script> 

    import Vue from "vue"; 

    import { TextBoxPlugin } from '@syncfusion/ej2-vue-inputs'; 

    Vue.use(TextBoxPlugin); 

    export default { 

        data() { 

            return { 

                value: "Syncfusion" 

            } 

        }, 

        methods: { 

            onCreate: function (args) { 

                let value = this.$refs.textareaObj.value; 

                alert(value); 

            } 

        } 

    } 

</script> 

 

<style lang="scss"> 

    @import "../node_modules/@syncfusion/ej2-base/styles/material.css"; 

    @import "../node_modules/@syncfusion/ej2-vue-inputs/styles/material.css"; 

</style> 

 

Sample Link: http://www.syncfusion.com/downloads/support/forum/144576/ze/quickstart-1922656169 

 

Please let us know, if you have any concern. 

 

Regards, 

Ashokkumar B. 

[sayali saitawdekar]

What if i want the value of textbox, when user enters value in a textbox?

[Ashokkumar Balasubramanian]

Hi sayali saitawdekar, 

 

You can get the updated value of TextBox component using change event argument. Please find the below code block. 

 

Note: Change event triggered when the value changed in textbox (After focus out the input) 

 

<ejs-textbox ref="textboxObj" :change="changeValue" placeholder="First Name"></ejs-textbox>   

  

  methods:{ 

    changeValue:function(args){ 

        console.log(args.value); 

    } 

  } 

 

Also, we can able to get the value of TextBox using component reference. Please refer the below code block. 

 

<ejs-textbox ref="textboxObj" :change="changeValue" placeholder="First Name"></ejs-textbox> 

 

methods:{ 

    changeValue:function(args){ 

        console.log(this.$refs.textboxObj.ej2Instances.value); 

    } 

  } 

 

Please check the provided code block and get back to us, if you need any further assistance. 

 

Regards, 

Ashokkumar B.