'UWP is binded checkbox is checked?

So I created a combobox with inside a few binded checkboxes. My xaml looks like this:

<ComboBox x:Name="CbSandwichFilling" ItemsSource="{x:Bind SandwichFillingList}" PlaceholderText="Choose sandwich filling">
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <CheckBox Name="{Binding Ingredient_name}" Content="{Binding Ingredient_name}"/>
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>

My C# looks like this:

private List<Ingredients> sandwichFilling;

public List<Ingredients> SandwichFillingList
{
    get { return sandwichFilling; }
    set { sandwichFilling = value; }
}

public BasicSandwiches()
{
    sandwichFilling = Ingredients.GetIngredients("sandwichFilling");
    this.DataContext = SandwichFillingList;
}

The fuction GetIngredients("sandwichFilling") receives sandwich fillings from the database and put them in a Checkbox inside of the ComboBox.

When the user presses a button, I want the program to know which Checkboxes are checked. How can i do this?



Solution 1:[1]

When the user presses a button, I want the program to know which Checkboxes are checked. How can i do this?

For your requirement, you need to create data source for binding. The follow is data model that inherit INotifyPropertyChanged interface.

public class Ingredients : INotifyPropertyChanged
{
    public Ingredients()
    {

    }
    public event PropertyChangedEventHandler PropertyChanged;
    private void OnPropertyChang([CallerMemberName] string propertyName = null)
    {
        if (PropertyChanged != null)
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
    }
    private string _Ingredient_name;
    public string Ingredient_name
    {
        get
        {
            return _Ingredient_name;
        }
        set
        {
            _Ingredient_name = value;
            OnPropertyChang();
        }
    }

    private bool _IsCheck;
    public bool IsCheck
    {
        get
        {
            return _IsCheck;
        }
        set
        {
            _IsCheck = value;
            OnPropertyChang();
        }
    }
}

Then create your MainPageViewModel that use to bind with xaml code.

public class MainPageViewModel
{
    public ObservableCollection<Ingredients> Items { get; set; }
    public MainPageViewModel()
    {
        Items = new ObservableCollection<Ingredients>()
        {
            new Ingredients()
            {
                Ingredient_name= "Nico",
                IsCheck=false
            },
               new Ingredients()
            {
                Ingredient_name= "mimi",
                IsCheck=false
            },
                  new Ingredients()
            {
                Ingredient_name= "kiki",
                IsCheck=false
            },
                     new Ingredients()
            {
                Ingredient_name= "zizi",
                IsCheck=false
            },
                        new Ingredients()
            {
                Ingredient_name= "sasa",
                IsCheck=false
            },

        };

    }
}

Usage

<Page.DataContext>
    <local:MainPageViewModel x:Name="ViewModel" />
</Page.DataContext>

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="4*"/>
        <RowDefinition Height="1*"/>

        <RowDefinition Height="4*"/>
    </Grid.RowDefinitions>
    <ComboBox  x:Name="CbSandwichFilling" ItemsSource="{Binding Items}" PlaceholderText="Choose sandwich filling">
        <ComboBox.ItemTemplate>
            <DataTemplate>
                <CheckBox Content="{Binding Ingredient_name}" IsChecked="{Binding IsCheck,Mode=TwoWay}" />
            </DataTemplate>
        </ComboBox.ItemTemplate>
    </ComboBox>
    <Button Grid.Row="1" Click="Button_Click" Content="ShowAllItem"/>
    <TextBlock Grid.Row="2" Name="InfoDisplay" />
</Grid>

Note that you need set binding mode of IsChecked property as TwoWay, so that it can change data source when you checked. And you can't bind Name property to Ingredient_name or it will throw xaml exception.

MainPage.cs

public sealed partial class MainPage : Page
{
    public MainPage()
    {
        this.InitializeComponent();

    }

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        StringBuilder info = new StringBuilder();
        foreach (var item in ViewModel.Items )
        {
            info.AppendLine(item.Ingredient_name + "--------" + item.IsCheck.ToString());
        }
        InfoDisplay.Text = info.ToString();
    }
}

enter image description here

For more you could refer Data binding in depth document.

Solution 2:[2]

<CheckBox Checked="" Unchecked=""/>

Unchecked for FALSE Checked for TRUE

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Nico Zhu - MSFT
Solution 2 ChickChuck2