Radio button error "cannot convert 'bool' to 'string' on 18.3 version

I was until now using Version="18.1.0.45", in which the radion button was working flawlessly for what I need. Upon updating to Version="18.3.0.48", the exact code breaks. 

<div class="custom-control-inline">
                                <SfRadioButton CssClass="inline" Label="News" Name="InfoSection" Value="News" Checked="@(infoSectionType == "News")" @onchange="@(() => { infoSectionType = "News"; })"></SfRadioButton>
                            </div>
<div class="custom-control-inline">
                                <SfRadioButton CssClass="inline" Label="Competitors" Name="InfoSection" Value="Competitors" Checked="@(infoSectionType == "Competitors")" @onchange="@(() => { infoSectionType = "Competitors"; })"></SfRadioButton>
                            </div>
<div class="custom-control-inline">
                                <SfRadioButton CssClass="inline" Label="Stock Information" Name="InfoSection" Value="Stock" Checked="@(infoSectionType == "Stock")" @onchange="@(() => { infoSectionType = "Stock"; })"></SfRadioButton>
                            </div>

This is the code I was/am using which was working (I could not figured out a way to have the text be pasted as a code snip to be of easier visualization.

Upon researching the forum here, I came across another post here (Link), from a few months back, where the user seemed to have a similar problem. The suggested correction there does not seem to work, in the following way:

if TChecked="string", I get the compiling error "cannot convert 'bool' to 'string' and cannot build the solution.

if TChecked="bool", there is no compiling error, I am able to build and run it. However, when I reach the page, it breaks with the following error:
blazor.webassembly.js:1 crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
      Unhandled exception rendering component: String 'News' was not recognized as a valid Boolean.
System.FormatException: String 'News' was not recognized as a valid Boolean.

if I do not include a TChecked (as I did not have it before), I still get the same error:
blazor.webassembly.js:1 crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
      Unhandled exception rendering component: String 'News' was not recognized as a valid Boolean.
System.FormatException: String 'News' was not recognized as a valid Boolean.

Really looking forward to hearing from you, to see if I can make this work on the latest update or if I will need to downgrade to my older version.

3 Replies 1 reply marked as answer

MK Mohan Kumar Ramasamy Syncfusion Team November 12, 2020 07:34 AM UTC

Hi Eric, 
 
Sorry for the inconvenience caused. In this version (v18.2.44), we have included some breaking changes in Radio Button component. We would like you to review the breaking changes from the below location before you upgrade.

 
We have get the selected button using two-way binding Checked property. Please refer below code snippets. 
 
 
@using Syncfusion.Blazor.Buttons 
 
<div class="control-section"> 
    <div class="radio-control"> 
        <h4 class="row">Select a method : @CheckedValue</h4> 
        <div class="row"> 
            <SfRadioButton Label="News" Name="InfoSection" Value="News" @bind-Checked="@CheckedValue" ValueChange="buttonChange" TChecked="string"></SfRadioButton> 
        </div> 
        <div class="row"> 
            <SfRadioButton Label="Competitors" Name="InfoSection" Value="Competitors" @bind-Checked="@CheckedValue" ValueChange="buttonChange" TChecked="string"></SfRadioButton> 
        </div> 
        <div class="row"> 
            <SfRadioButton Label="Stock Information" Name="InfoSection" Value="Stock" @bind-Checked="@CheckedValue" ValueChange="buttonChange" TChecked="string"></SfRadioButton> 
        </div> 
        <div class="row"> 
            <SfRadioButton Label="Other" Name="InfoSection" Value="others" @bind-Checked="@CheckedValue" ValueChange="buttonChange" TChecked="string"></SfRadioButton> 
        </div> 
    </div> 
</div> 
 
@code { 
    private string CheckedValue = "News"; 
 
    private void buttonChange(ChangeArgs<string> args) 
    { 
 
    } 
} 
 
<style> 
    .radio-control { 
        margin: 5% 0 5% 40%; 
    } 
 
    .control-section .row { 
        margin: 20px 0; 
    } 
 
</style> 
 
 
For your reference, we have prepared a sample based on this. Please refer below link. 
 
 
Please let us know if you need any further assistance. 
 
Regards, 
Mohan kumar R 


Marked as answer

ER Eric November 12, 2020 02:38 PM UTC

Hi Mohan,

As always, thank you for your reply. It works perfectly now.

Have a great day.

P.S. If I may ask, how can I paste code here where it stays formatted, like on your answers?


SP Sangeetha Priya Murugan Syncfusion Team November 13, 2020 04:44 AM UTC

Hi Eric, 
 
Thank you for your update.  
 
We have copied the code snippets from visual studio application (default theme) and format these codes in word document before update. Please feel free to contact us, if you need any further assistance on this. 
  
Regards, 
Sangeetha M 


Loader.
Up arrow icon