Articles in this section
Category / Section

How to get the values of selected Checkboxes in a Group using .NET MAUI (SfCheckBox)?

3 mins read

This article explains how to get the values of the selected .NET MAUI CheckBox in a group using a collection of checkboxes.
You can access the selected(Checked) CheckBox values from the collection by using the StateChanged event. This event triggers when the state of a .NET MAUI CheckBox changes.

XAML:

    <StackLayout 
BindableLayout.ItemsSource="{Binding Cities}">
        <BindableLayout.ItemTemplate>
            <DataTemplate>
                <buttons:SfCheckBox Text="{Binding CityName}" StateChanged="SfCheckBox_StateChanged"/>
            </DataTemplate>
        </BindableLayout.ItemTemplate>
    </StackLayout>
    <Button WidthRequest="200" Text="Get Checked items" Clicked="Button_Clicked"/>
</StackLayout>


The StateChanged event contains the following argument IsChecked, which is used to get the current state value of CheckBox as per the following code snippet.

C#:

public partial class MainPage : ContentPage
{
    
    public MainPage()
    {
        InitializeComponent();
    }

    private List<string> items = new List<string>();

    private void SfCheckBox_StateChanged(object sender, StateChangedEventArgs e)
    {
        var text = (sender as SfCheckBox).Text;
        if ((bool)(sender as SfCheckBox).IsChecked)
        {
            items.Add(text);
        }
        if(!(bool)(sender as SfCheckBox).IsChecked)
        {
            items.Remove(text);
        }
    }

    private void Button_Clicked(object sender, EventArgs e)
    {
        string concatenate = string.Join("\n", items);
        App.Current.MainPage.DisplayAlert("You have selected", concatenate, "Ok");
    }
}

public class City
{
    public string CityName { get; set; }

}

public class ViewModel
{
    private ObservableCollection<city> cities;

    public ObservableCollection<city> Cities
    {
        get { return cities; }
        set { cities = value; }
    }
    public ViewModel()
    {
        Cities = new ObservableCollection<city>();
        Cities.Add(new City() { CityName = "Tokyo" });
        Cities.Add(new City() { CityName = "Paris" });
        Cities.Add(new City() { CityName = "New York City" });
        Cities.Add(new City() { CityName = "Singapore" });
        Cities.Add(new City() { CityName = "Vienna" });
        Cities.Add(new City() { CityName = "Sydney" });
        Cities.Add(new City() { CityName = "Zurich" });
        Cities.Add(new City() { CityName = "Toronto" });
        Cities.Add(new City() { CityName = "Copenhagen" });
        Cities.Add(new City() { CityName = "Melbourne" });
        Cities.Add(new City() { CityName = "Dubai" });
    }
}

Output:

ezgif.com-video-to-gif (18).gif

Conclusion:

I hope you enjoyed learning how to get the values of selected Checkboxes in a Group using .NET MAUI.

Refer to our .NET MAUI CheckBox’s feature tour page for other groundbreaking feature representations. You can explore our .NET MAUI CheckBox documentation to understand how to present and manipulate data.

For current customers, check out our .NET MAUI components from the License and Downloads page. If you are new to Syncfusion®, try our 30-day free trial to check out our .NET MAUI CheckBox and other .NET MAUI components.

Please let us know in the following comments section if you have any queries or require clarifications. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied