Radio button

[Belle Cruz]

1. How to customize the radio button spacing vertically?
2. I want radio button single selection instead of group selection.

[Janakiraman Sakthivel]

Hi Belle Cruz, 

 

Query1 - How to customize the radio button spacing vertically?: 

 

We can achieve your reported requirement by using the CSS style as shown in the code below. 

 

[Index.razor]:  

<div class="row"> 

            <SfRadioButton Label="Credit/Debit Card" Name="payment" Value="credit/debit" Checked="@checkedValue"></SfRadioButton> 

</div> 

<div class="row"> 

            <SfRadioButton Label="Net Banking" Name="payment" Value="netbanking" Checked="@checkedValue"></SfRadioButton> 

</div> 

<div class="row"> 

            <SfRadioButton Label="Cash on Delivery" Name="payment" Value="cashondelivery" Checked="@checkedValue"></SfRadioButton> 

 </div> 

<div class="row"> 

            <SfRadioButton Label="Other Wallets" Name="payment" Value="others" Checked="@checkedValue"></SfRadioButton> 

</div> 

 

<style> 

    .row { 

        margin: 20px 0; 

    } 

</style> 

  

For your convenience, we have prepared the sample for this. Please find the sample link below, 

 

Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/server-sample-1918639544 

 

Could you please check the above link and explain your query in detail, if we misunderstood your requirement or if you need any further assistance on this? Based on that we will check and provide you a better solution quickly. 

 

Query2 - I want radio button single selection instead of group selection: 

 

Please follow this forum “172637” for further updates. 

 

Regards, 

Janakiraman S. 

[Sarah]

Hi,

1-How to customize the radio button spacing horizontally?

2-Error:can not convert from 'int' to 'string'

@foreach (var itemR in @lstCls ){

selectedItem ">

}

int? selectedItem { get; set}

List lstCls;

public class Cls

{

public int Id { get; set; }

public string Name { get; set; }

}

3-Suppose we are going to ask the user a question and show a number of radio buttons for the user's answer. If the user is free to answer the question or not. What is your solution for implementing this? One way is to add a radio button with the title None. Do you have any other suggestions?

thank you