Search code examples
vuejs2datagridfocusselectiondevextreme

Devextreme Vue Datagrid configure selection and focus row together


I am configuruing my devextreme datagrid. I have to use both muliple selection and rowfocus together. I am able to limit selection on selection column checkbox only , so that I dont select a row if I click anywhere in the grid, It always have to be the selection checkbox. Now to include row focus it's creating a problem, when ever I am clicking selection checkbox it's focusing the row first, I have to click on it again to achieve row selection. So how do I prevent row focus event on selection checkbox column? Refer below configuraion: -

<dx-data-grid :allow-column-reordering="true"
              :allow-column-resizing="true"
              :column-fixing="{enabled: true}"
              :columns="config.columns"
              :data-source="groupTypes"
              :ref="ref"
              :rowAlternationEnabled="true"
              :show-borders="true"
              @toolbar-preparing="onToolbarPreparing($event)"
              key-expr="entityId"
              :focused-row-enabled="true"
              :focused-row-key.sync="focusedRowKey">

              <dx-selection :select-all-mode="selectionMode"
                             mode="multiple"
                             show-check-boxes-mode="always"/>
</dx-data-grid>

Solution

  • I removed the :column-fixing="{enabled: true}" porperty from data grid, Now it's working