Data Binding Radio Button Group

Question

Hello!

I'm having a small problem here with data binding to a Radio Button Group.

I want to get the "Content" Value of the selected Radio Button. How do I connect to that?

{Binding Path=Content, ElementName=radioButton0, Mode=Default}

 

This seems to work for one RadioButton, but how do I get the value of the SelectedItem of the whole RadioButton group?

Here's my code:

Code Snippet

 <Canvas>
  <StackPanel x:Name="testPanel">
   <RadioButton Content="RadioButton 0" GroupName="testGroup" x:Name="radioButton0" />
   <RadioButton Content="RadioButton 1" GroupName="testGroup" x:Name="radioButton1" IsChecked="True"  />
  </StackPanel>
  <TextBox x:Name="textBox" Canvas.Top="40" Canvas.Left="0" Width="100" Text="{Binding Path=Content, ElementName=radioButton0, Mode=Default}"></TextBox>
 </Canvas>

 

 

Thanks for your help in advance!

Answer 1

You can use a ListBox to group the RadioButtons, and bind the ListViewItem.IsSelected property to RadioButton.IsChecked property. Setting the TextBox.Text property to ListBox.SelectedItem property. Here is the example.

 

Code Snippet

<StackPanel>

    <ListBox x:Name="RadioButtonList" BorderThickness="0" Background="{x:Null}">

        <ListBox.ItemContainerStyle>

            <Style TargetType="{x:Type ListBoxItem}">

                <Setter Property="Template">

                    <Setter.Value>

                        <ControlTemplate TargetType="{x:Type ListBoxItem}">

                            <ContentPresenter/>

                        </ControlTemplate>

                    </Setter.Value>

                </Setter>

            </Style>

        </ListBox.ItemContainerStyle>

 

        <ListBoxItem IsSelected="{Binding IsChecked, ElementName=RadioButton1, Mode=OneWay}">

            <RadioButton x:Name="RadioButton1" GroupName="Group">RadioButton1</RadioButton>

        </ListBoxItem>

        <ListBoxItem IsSelected="{Binding IsChecked, ElementName=RadioButton2, Mode=OneWay}">

            <RadioButton x:Name="RadioButton2" GroupName="Group">RadioButton2</RadioButton>

        </ListBoxItem>

    </ListBox>

    <TextBox Text="{Binding SelectedItem.Content.Content, ElementName=RadioButtonList}"/>

</StackPanel>

 

 

Best Regards,

Wei Zhou

Answer 2

 

Thanks a lot Wei. That did the trick! Cool!

Answer 3

This is just what I needed... with a slight difference...

How can you get the radio buttons to be side-by-side?

Answer 4

Hi,
This helped me probably it might prove usefull for you too.


<

Style x:Key="VerticalRadioButtonListStyle" TargetType="ListBox">

 

<Style.Resources>

 

<Style TargetType="ListBoxItem">

 

<Setter Property="Template">

 

<Setter.Value>

 

<ControlTemplate TargetType="ListBoxItem">

 

<Grid>

 

<Grid.ColumnDefinitions>

 

<ColumnDefinition Width="Auto" />

 

</Grid.ColumnDefinitions>

 

<RadioButton IsChecked="{Binding IsSelected,

 

RelativeSource={RelativeSource TemplatedParent},

 

Mode=TwoWay}" Content="{Binding Content,

 

RelativeSource={RelativeSource TemplatedParent},

 

Mode=TwoWay}"/>

 

</Grid>

 

</ControlTemplate>

 

</Setter.Value>

 

</Setter>

 

</Style>

 

</Style.Resources>

 

<Setter Property="ItemsPanel">

 

<Setter.Value>

 

<ItemsPanelTemplate>

 

<WrapPanel Orientation="Horizontal" />

 

</ItemsPanelTemplate>

 

</Setter.Value>

 

</Setter>

 

<Setter Property="BorderThickness" Value="0" />

 

<Setter Property="Background" Value="Transparent" />

 

</Style>

Zepher

---

Zepher684