How to use SfRadioButton inside paged ListView

[Anton]

Hi, can you please help me to deal with the following problem.

Let's say I have a list of issues and want to display one issue on a page. For creating list of pages, I used this: https://help.syncfusion.com/xamarin/sflistview/working-with-sflistview#paging

Each issue has a list of states: None, Backlog, In progress and Done. States should be displayed on each page as a SfRadioGroup to provide single selection. 

The problem is that when I tap on page 2, all SfRadioButton values on page 1 are setting to false. It happens after specifying ItemSource property for ListView in SfListViewPagingBehavior.cs : 

_listView.ItemsSource = source.AsEnumerable();

As a result, when I return to page 1, none of the SfRadioButtons is selected. What should I do in order to save selected SfRadioButton between navigating pages?

Please find the example with the described problem attached.

Attachment: PagingWithRadioButtons_b2ea1a56.rar

[Geetha Rajendran]

Hi Anton, 

 

We are currently checking this with high priority and will update you the complete details on today. 

 

Regards, 

Geetha R. 

[Hemalatha Marikumar]

Hi Anton,

Thanks for your patience.

We have analyzed your sample and you have used the same groupKey for all the SfRadioButtons which is placed inside the SfRadioGroup. We would like to let you know that, it’s not a valid scenario to use GroupKey within RadioGroup because both are doing the same job except GroupKey can be used for the RadioButtons which is placed inside any layout.

We have modified your sample by creating a new instance for GroupKey while getting ItemSource. Please refer the below code. 

 
Code snippet[XAML]: 

 

<listView:SfListView.ItemTemplate> 

              <DataTemplate> 

                             <StackLayout> 

                                           <Label 

                                                         FontSize="Medium" 

                                                         HorizontalTextAlignment="Center" 

                                                         Text="{Binding Info}"/> 

                                           <StackLayout 

                                                         x:Name="radioGroup" 

                                                         BindableLayout.ItemsSource="{Binding States}"> 

                                                          <BindableLayout.ItemTemplate> 

                                                                        <DataTemplate> 

                                                                                      <button:SfRadioButton  

                                                                                                    Margin="8,12,8,0" 

                                                                                                    GroupKey="{Binding GroupKey}" 

                                                                                                    HorizontalOptions="FillAndExpand" 

                                                                                                    Text="{Binding Name}"  

                                                                                                    IsChecked="{Binding IsChecked,Mode=TwoWay}"/> 

                                                                        </DataTemplate> 

                                                          </BindableLayout.ItemTemplate> 

                                           </StackLayout> 

                             </StackLayout> 

              </DataTemplate> 

</listView:SfListView.ItemTemplate> 

  

Code snippet[C#]: IssueState.cs 

  

public class IssueState: INotifyPropertyChanged 

{ 

   public string Name { get; set; } 

  

   public SfRadioGroupKey GroupKey { get; set; } 

  

   . . .  

} 

  

Code snippet [C#]: IssueViewModel.cs 

 

public class IssueViewModel: INotifyPropertyChanged 

{ 

    public SfRadioGroupKey GroupKey { get; set; } 

  

   private ObservableCollection<IssueState> _states; 

    public ObservableCollection<IssueState> States 

    { 

       get 

       { 

         GroupKey = new SfRadioGroupKey(); 

         if(_states != null) 

         { 

             foreach (var item in _states) 

             { 

                 item.GroupKey = GroupKey; 

             } 

         } 

  

         return _states; 

       } 

       set 

       { 

                 if (_states == value) 

                   return; 

  

                 _states = value; 

                 OnPropertyChanged(); 

              } 

    } 

} 

  

Sample – https://www.syncfusion.com/downloads/support/forum/148143/ze/148143-PagingWithRadioButtons1929238642.zip 

  

Please get back to us for further assistance. 

  

Regards, 

Hemalatha M. 

[Anton]

I realized my mistake. Thank you, guys. It is working now!

[Hemalatha Marikumar]

Hi Anton, 

 

Thanks for your update. 

 

Please let us know if you have any other query. 

 

Regards, 

Hemalatha M.