1. Home
  2. Forum
  3. Blazor
  4. Dynamic bind ButtonGroupButton

Dynamic bind ButtonGroupButton

Hi, I'm trying to dynamically bind the values of my model to the @bind-Selected property of a ButtonGroupButton but without success so far. I've tried reflection but it gives me the following error when compiling :
Cannot modify the result of an unboxing 

Is there a way to achieve this with or without reflection?



DaysOfTheWeekSelectorComponent.razor

@using System.Reflection
@typeparam TItem



<SfButtonGroup Mode="Syncfusion.Blazor.SplitButtons.SelectionMode.Multiple">

    @foreach (var item in DaysOfWeek)
    {
        PropertyInfo pi = typeof(TItem).GetProperty(@item);
       
        <ButtonGroupButton 
                          @bind-Selected="@((bool)pi.GetValue(BindValue, null))"  <-- compile error here
                           CssClass="groupbuttonDays">@item.Substring(0, 3)
            </ButtonGroupButton>

    } 
</SfButtonGroup>



@code {



    [Parameter]
    public TItem BindValue { get; set; }

    private IEnumerable<string> DaysOfWeek = new List<string>()
    {
        "Monday",
        "Tuesday",
        "Wednesday",
        "Thursday",
        "Friday",
        "Saturday",
        "Sunday",
    };

}

Index.razor

 <DaysWeekSelectorComponent TItem="MyClass" BindValue="myClassValues"/>

@code {

   MyClass myClassValues = new MyClass()
{
    Monday = true,
    Tuesday = false,
....
}

MyClass.cs
 public class MyClass
    {
       ...
        public bool Monday { get; set; } = false;
        public bool Tuesday { get; set; } = false;
        public bool Wednesday { get; set; } = false;
        public bool Thursday { get; set; } = false;
        public bool Friday { get; set; } = false;
        public bool Saturday { get; set; } = false;
        public bool Sunday { get; set; } = false;

    }


Many thanks!


4 Replies 1 reply marked as answer
GK Gayathri KarunaiAnandam Syncfusion Team June 18, 2021 03:43 AM UTC

Hi Alvaro, 

We have checked your reported query and code snippet. We need to validate more on this query. So, we will update you the further details on June 21st, 2021. We appreciate your patience until then. 


Regards, 
Gayathri K 


GK Gayathri KarunaiAnandam Syncfusion Team June 23, 2021 03:03 PM UTC

Hi Alvaro, 

Thanks for the patience. 

We have analyzed your query.  We would like to let you know that we are facing issue in two way binding of ButtonGroup Component. We logged a defect report for this issue. The fix will be available in our upcoming patch release. It will be scheduled on July 7th, 2021.  After this patch release, we will prepare the sample based on your requirement. We appreciate your patience until then.  

You can track the status of this bug using below link from our feedback portal.  
  

Regards, 
Gayathri K 


GK Gayathri KarunaiAnandam Syncfusion Team June 24, 2021 03:14 PM UTC

Hi Alvaro, 

We have prepared a sample based on your requirement. Please check the below code snippet and sample. 

Code snippet: 

@using System.Reflection 
@using Syncfusion.Blazor.SplitButtons 
@typeparam TItem 
 
<SfButtonGroup Mode="Syncfusion.Blazor.SplitButtons.SelectionMode.Multiple"> 
    @foreach (var item in DaysOfWeek) 
    { 
        PropertyInfo prop = BindValue.GetType().GetProperty(item); 
        string value = prop.GetValue(BindValue).ToString(); 
        bool boolValue = bool.Parse(value); 
        <ButtonGroupButton Selected="@boolValue" CssClass="groupbuttonDays">@item.Substring(0, 3)</ButtonGroupButton> 
    } 
</SfButtonGroup> 
 
@code { 
 
[Parameter] 
public TItem BindValue { get; set; } 
 
    private IEnumerable<string> DaysOfWeek = new List<string>() 
    { 
        "Monday", 
        "Tuesday", 
        "Wednesday", 
        "Thursday", 
        "Friday", 
        "Saturday", 
        "Sunday", 
    }; 
} 



<DaysOfTheWeekSelectorComponent BindValue="myClassValues" TItem="MyClass"></DaysOfTheWeekSelectorComponent> 
 
@code { 
    MyClass myClassValues = new MyClass() 
    { 
        Monday = true, 
        Tuesday = true, 
        Wednesday = true, 
        Thursday = true, 
        Friday = true, 
        Saturday = false, 
        Sunday = false 
    }; 
 
    public class MyClass 
    { 
        public bool Monday { get; set; } = false; 
        public bool Tuesday { get; set; } = false; 
        public bool Wednesday { get; set; } = false; 
        public bool Thursday { get; set; } = false; 
        public bool Friday { get; set; } = false; 
        public bool Saturday { get; set; } = false; 
        public bool Sunday { get; set; } = false; 
 
    } 
} 
 
 

Please check the above sample and get back to us if you need further assistance. 

Regards, 
Gayathri K 


AS Aravinthan Seetharaman Syncfusion Team July 7, 2021 08:22 AM UTC

Hi Alvaro, 
 
Thanks for the patience. 
 
We are glad to announce that our weekly patch release (19.2.0.46) is rolled out. We have included the fix for your issue [Two way binding not working in Button Group] in this release. So, we suggest you upgrade our Syncfusion packages to our latest version to resolve this issue in your end. (19.2.0.46). 
 
Please let us know if you have any concern on this. 
 
Regards, 
Aravinthan S

Marked as answer
Loader.
Up arrow icon