Hi Ebi,
Thanks for contacting Syncfusion support.
We suggest you to use the “Column Template feature of Grid”. We have prepared a sample based on this requirement. Please download the sample from the link below,
In the above demo, we will be rendering a “EjsRadioButton” in Grid by using the Column Template feature of Grid. And in the “ValueChange” event handler of RadioButton we will be calling the “SelectRow” method of Grid based on the row index fetched from the PrimaryKey column value of Grid(this primary key value is assigned as Value for Radio button also. Ensure that this primary key value is unique). And to prevent selection in Grid by clicking the row we have enabled the “CheckboxOnly” property. So now the Grid row will be selected only when the radio button in the Grid column is checked.
Please refer the code example and the code explanation below,
|
<EjsGrid @ref="GridInstance" DataSource="@Orders" AllowPaging="true">
<Syncfusion.EJ2.Blazor.Grids.GridSelectionSettings CheckboxOnly="true"></Syncfusion.EJ2.Blazor.Grids.GridSelectionSettings>
<GridPageSettings PageSize="5"></GridPageSettings>
<GridColumns>
<GridColumn>
<Template>
@{
var PrimaryVal = (context as Order);
<EjsRadioButton Name="RadioBtn" @ref="Radio" Value="@PrimaryVal.CustomerID" ValueChange="ValueChange"></EjsRadioButton> @*Set Value property based on primary Key column(CustomerID) value.*@
}
</Template>
</GridColumn>
<GridColumn Field=@nameof(Order.CustomerID) HeaderText="Customer Name" IsPrimaryKey="true" Width="150"></GridColumn> @*Set primary Key for an unique value column and assign that column value as value for radio button’s Value property also*@
</GridColumns>
</EjsGrid>
@code{
EjsRadioButton Radio;
EjsGrid<Order> GridInstance;
...
public async void ValueChange(ChangeArgs args)
{
var index = await GridInstance.GetRowIndexByPrimaryKey(args.Value); //Fetch the row index based on the unique Value of RadioButton
GridInstance.SelectRow(index); //Select the corresponding Grid row.
}
}
|
Documentation :
Please get back to us if you need further assistance.
Regards,
Renjith Singh Rajendran.
