How can I get RowData from attribute data-uid?

[Pop Alex]

Hi,

I have this code: 

<ejs-grid ref='grid' id='Grid' :dataSource="data" :allowSorting='true' class="table-dabo">

        <e-columns>

              <e-column field='userId' headerText='Id' width=130 :visible="false"></e-column>

              <e-column field='userName' headerText='Nume Complet' width=130></e-column>

              <e-column field='email' headerText='Email' width=130></e-column>

              <e-column field='phone' headerText='Telefon' width=130 :allowSorting='false'></e-column>

              <e-column field='franchiseName' headerText='Nume Franciza' width='180' clipMode='EllipsisWithTooltip'></e-column>

              <e-column field='address' headerText='Adresa' width='220' clipMode='EllipsisWithTooltip'></e-column>

              <e-column headerText='Actiuni' width="180" minWidth='270' :template='buttonsTemplate' textAlign='Right' :allowSorting='false'></e-column>

        </e-columns>
</ejs-grid>

.. the script part: 

<script>

import Vue from "vue"; 

import { GridPlugin, Sort, CommandColumn } from "@syncfusion/ej2-vue-grids";

import Edit from '../Icons/Edit'

Vue.use(GridPlugin);

export default {

data () {

return {

data: [

{ userId: 1, userName: 'Popescu Ion Doru', email: '[e-mail]', phone: '[phone]', franchiseName: 'DaBo Massachusetts Brogan', address: 'Chad, Massachusetts Brogan , 225 Bills Place' },

{ userId: 2, userName: 'Pena Valdez', email: '[e-mail]', phone: '[phone]', franchiseName: 'DaBo American Samoa Durham', address: 'Mauritania, American Samoa Durham , 240 Hillel Place' },

{ userId: 3, userName: 'Kerri Barber', email: '[e-mail]', phone: '[phone]', franchiseName: 'DaBo Nebraska Callaghan', address: 'Tonga, Nebraska Callaghan , 500 Gold Street' },

],

buttonsTemplate: () => {

return { template : Vue.component('columnTemplate',{

template: `<div class="btns-actions-table">

<button class="secondary-action-row" @click="editFranchise"><edit></edit></button>

</div>`,

data: function() {

return {

data: {}

}

},

components: {

Edit

},

methods: {

editFranchise: (args) => {

                        var rowEle = $(args.target).closest('.e-row')

                          var dataUID = rowEle[0].getAttribute('data-uid')

                          // console.log(this.$refs.grid.getRowObjectFromUID(dataUID))

},

}

})}

},

}

},

provide: {

grid: [Sort, CommandColumn]

},

components: {

Edit

},

methods: {

}

}

</script>

--------------

The function getRowObjectFromUID does not exist, how i can get the data?

Regards, Pop Alex

[Balaji Sekar]

Hi Pop, 

 

Greetings from Syncfusion support. 

 

We checked your reported problem but were unfortunately unable to reproduce it from our end as the row data was properly returned from the getRowObjectFromUID method. Please check below sample and screenshot for your reference, 

 

Sample: https://www.syncfusion.com/downloads/support/forum/151265/ze/GridApp-794610380 

 

You can cross check the above sample with your application to see if you have missed anything. 

 

Screenshot: 

 

 

It would be helpful to identify it better if you could share the following information, 

  

• Are any console errors thrown? If so, please share it.
• Syncfusion package version.
• Share us the grid related code file.
• If possible, share us a simple sample application to replicate the issue or try reproducing it in the above provided sample.

 

Let us know if you have any concerns. 

 

Regards, 

Balaji Sekar. 

[Pop Alex]

Thanks its works!

Now I have another problem, how can i send rowData to buttonsTemplate. to do a v-if on template, for example:
I tried this: