Editing in batch mode

[Eric Albino]

I am having a problem when clicking on the edit button in batch mode. I understand that double clicking edits the row, but would like the edit button to work as well. 

[Pavithra Subramaniyam]

Hi Eric,  

 

Greetings from Syncfusion. 

 

You can start cell editing with toolbar Edit button by using the editCell method of Grid. In the below sample, we have edited the cell using editCell method in toolbar click event.  

 

Please check the below code example, documentation link and sample link for more information. 

 

<template> 

  <div id="app"> 

     <ejs-grid :dataSource='data' ref="grid" :toolbarClick="toolbarClick" :editSettings='editSettings' :toolbar='toolbar' height='273px'> 

            <e-columns> 

                 .  .  . 

            </e-columns> 

        </ejs-grid> 

  </div> 

</template> 

 

<script> 

import Vue from "vue"; 

import { GridPlugin,Page, Toolbar, Edit } from "@syncfusion/ej2-vue-grids"; 

import { data } from './datasource.js'; 

Vue.use(GridPlugin); 

export default { 

  name: "App", 

    .  .  . 

   methods: { 

    toolbarClick: function(args) {  

      if(args['item'].text === 'Edit') { 

             // here we have stop the mouse event propagation to avoid cell save 

        args.originalEvent.stopPropagation();                  this.$refs.grid.ej2Instances.editModule.editCell(Math.min(this.$refs.grid.ej2Instances.getSelectedRowIndexes()), "CustomerID"); 

     } 

    }      

   } 

}; 

</script> 

 

 

Documentation :  https://ej2.syncfusion.com/vue/documentation/api/grid/edit/#editcell 

 

Sample               : https://codesandbox.io/s/vue-template-i4kmw 

 

Please get back to us if you need any further assistance on this.  

 

Regards, 

Pavithra S.