<ejs-grid id="GridUS_doc" created='created' allowPaging="true"cellSelected="cellSelected" dataSource="ViewBag.dataSource">
<e-grid-selectionSettings mode="Cell" type="Single"></e-grid-selectionSettings>
<e-grid-columns>
<e-grid-column field="ShipName" headerText="ShipName" width="150"></e-grid-column>
. . .
</e-grid-columns>
</ejs-grid>
<br />
<script>
function created(args) {
// we are binding the mousedown event inside the “created” event of Grid.
this.element.addEventListener("mousedown", function (e) {
if (e.button == 2 && e.target.classList.contains("e-rowcell")) {
var grid = document.getElementsByClassName('e-grid')[0].ej2_instances[0]
var rowObj = grid.getRowObjectFromUID(ej.base.closest(e.target, '.e-row').getAttribute('data-uid')); // getting row information
var r_index = rowObj.index;
var c_index = parseInt(e.target.getAttribute("aria-colindex"));
grid.selectCell({ rowIndex: r_index, c_index: }, true);
}
});
}
</script> |
Hi bright,Query: when I click the right mouse button, I want to select the cell in the grid, how can I set it?You can achieve your requirement by binding the JavaScript “mousedown” or “contextmenu” event to the Grid element. In that event you can select the Grid cells by using the “selectCell” method. Please refer to the below code example, Documentation link and sample link.[inde.cshtml]
<ejs-grid id="GridUS_doc" created='created' allowPaging="true"cellSelected="cellSelected" dataSource="ViewBag.dataSource"><e-grid-selectionSettings mode="Cell" type="Single"></e-grid-selectionSettings><e-grid-columns><e-grid-column field="ShipName" headerText="ShipName" width="150"></e-grid-column>. . .</e-grid-columns></ejs-grid><br /><script>function created(args) {// we are binding the mousedown event inside the “created” event of Grid.this.element.addEventListener("mousedown", function (e) {if (e.button == 2 && e.target.classList.contains("e-rowcell")) {var grid = document.getElementsByClassName('e-grid')[0].ej2_instances[0]var rowObj = grid.getRowObjectFromUID(ej.base.closest(e.target, '.e-row').getAttribute('data-uid')); // getting row informationvar r_index = rowObj.index;var c_index = parseInt(e.target.getAttribute("aria-colindex"));grid.selectCell({ rowIndex: r_index, c_index: }, true);}});}</script>Documentation: https://ej2.syncfusion.com/documentation/api/grid#createdPlease refer the sample for further details,Regards,Pavithra S.