- Home
- Forum
- ASP.NET Core - EJ 2
- select only one checkbox in the asp.net core grid
select only one checkbox in the asp.net core grid
Hi. I want to select only one checkbox. I user select another, the previous selection will be remove.
<div class="row tbl-padding">
<div class="col-md-12">
<ejs-tooltip id="Tooltip" target=".e-rowcell" beforeRender="beforeRender">
<e-content-template>
<ejs-grid id="Grid" dataSource="@Model" allowSelection="true" toolbar="@( new List<string>() { "Search" })"
allowSorting="true" allowPaging="true" allowFiltering="true" allowResizing="true" allowReordering="true"
>
<e-grid-selectionsettings type="Single"></e-grid-selectionsettings>
<e-grid-filterSettings type="Excel"></e-grid-filterSettings>
<e-grid-pagesettings id="pageSizes_Main" pageSizes="@(new string[] { "5", "10" , "20", "All" })" pageSize="10" pageCount="5"></e-grid-pagesettings>
<e-grid-columns>
<e-grid-column type="checkbox" width="50"></e-grid-column>
<e-grid-column headerText="DETAILS" template="#actionColumnTemplate" width="75px" headerTextAlign="Center"></e-grid-column>
<e-grid-column headerText="GAUGE TYPE" field="GaugeType_Name" width="150px"></e-grid-column>
<e-grid-column headerText="SIZE" field="ToolName_Size" width="100px"></e-grid-column>
<e-grid-column headerText="GRADUATION" field="ToolName_Graduation" width="130px"></e-grid-column>
<e-grid-column headerText="ACTUAL" field="ToolName_Actual" width="105px"></e-grid-column>
<e-grid-column headerText="DIAMETER" field="ToolName_Diameter" width="115px"></e-grid-column>
<e-grid-column headerText="LIMIT" field="ToolName_Limit" width="100px"></e-grid-column>
<e-grid-column headerText="ONSTOCK" field="ONSTOCK" width="115px" headerTextAlign="Left" textAlign="Right"></e-grid-column>
<e-grid-column headerText="RECEIVED" field="SumOfQtyReceive" width="118px" headerTextAlign="Left" textAlign="Right"></e-grid-column>
<e-grid-column headerText="WITHDRAW" field="SumOfQtyWithdraw" width="118px" headerTextAlign="Left" textAlign="Right"></e-grid-column>
<e-grid-column headerText="DEFECTIVE" field="SumOfQtyDefective" width="118px" headerTextAlign="Left" textAlign="Right"></e-grid-column>
<e-grid-column headerText="RETURN" field="SumOfQtyReturn" width="105px" headerTextAlign="Left" textAlign="Right"></e-grid-column>
<e-grid-column headerText="MISSING" field="SumOfQtyMissing" width="118px" headerTextAlign="Left" textAlign="Right"></e-grid-column>
<e-grid-column headerText="TOOL ID" field="ToolNameID" width="105px"></e-grid-column>
</e-grid-columns>
</ejs-grid>
</e-content-template>
</ejs-tooltip>
</div>
</div>
Hi Rejz Arron,
By default, Checkbox selection is used for multiple Grid row selection. So, if you want to maintain only one selected row, you can achieve your requirement by using the “rowSelecting” event of the Grid component. Please refer to the below code example, the documentation link, and the sample link.
|
function rowSelecting(e) { if (grid.getSelectedRecords().length) { grid.clearSelection(); } } |
https://ej2.syncfusion.com/javascript/documentation/api/grid/#rowselecting
https://ej2.syncfusion.com/javascript/documentation/api/grid/#getselectedrecords
https://ej2.syncfusion.com/javascript/documentation/api/grid/#clearselection
Please get back to us if you need further assistance on this.
Regards,
Pavithra S
- 1 Reply
- 2 Participants
-
RA Rejz Arron
- Jul 13, 2023 05:26 AM UTC
- Jul 14, 2023 01:33 PM UTC