CODEWITHSUNDEEP
phplaravelvue.jslaravel-5
Angel
Angel

Reputation: 1009

Laravel 5 : How to get the value in data attribute using vue js

I am new in vue js. In our app, we have validation if this value is already exists in the database. I want to improve it by making it a dynamic. So I added to put data attribute in my field whenever the user type anything. My value in mthe data attribute is the table where I will check if this value already exist.

Add.vue

<label>Code <span class="required-field">*</span></label>
       <input type="text" name="code" @keyup="checkCOACode" v-model="coa_code" class="form-control" :data-table="chart_of_accounts">

Add.vue in my method

checkCOACode(e) {
    e.preventDefault();
    var code = this.coa_code;
    var x    = event.target.getAttribute('data-table');

    alert(x);
    return false;
    axios.post("/checkIfCodeExists", {code:code})
        .then((response)  =>  {
            var code_checker = '';
            if (response.data == 0) {
                $('.add-chart-of-account').removeAttr('disabled','disabled');

            }else{
                $('.add-chart-of-account').attr('disabled','disabled');
                code_checker    =   'Code is already exist';
            }
            this.coa_checker_result = code_checker;
        });
},

My value in my x is null.

Question: How do I get the value of my data attribute?

Upvotes: 0

Views: 756

Answers (1)

Vibha Chosla
Vibha Chosla

Reputation: 713

You can get value of data attribute in vue by adding ref attribute to your text element 

<input type="text" ref="coaCode" name="code" @keyup="checkCOACode" v-model="coa_code" class="form-control" :data-table="chart_of_accounts">

And then get that attribute like

checkCOACode(e) {
    e.preventDefault();
    const coa = this.$refs.coaCode
    const coaCode = coa.dataset.table
    alert(coaCode);
    return false;

},

Upvotes: 1

Related Questions