Forum Xamarin.Forms
We are excited to announce that the Xamarin Forums are moving to the new Microsoft Q&A experience. Q&A is the home for technical questions and answers at across all products at Microsoft now including Xamarin!

We encourage you to head over to Microsoft Q&A for .NET for posting new questions and get involved today.

Get picker items in switch toggle event where controls are inside the listview

DarshanJSDarshanJS USMember ✭✭✭✭
edited November 2018 in Xamarin.Forms

Hi All,
Hi @LandLu,

I have stuck in a problem, i have a listview inside that i have used controls like Picker and Switch.

The problem is i want to get particular selectedindex value in picker items based on switch toggle which is inside listview.
Below is my Listview

<ListView x:Name="lstrenewal" Margin="0,-7,0,0" IsVisible="False" Grid.Row="4" HeightRequest="200"   BackgroundColor="#f2ffff" HasUnevenRows="True"  ItemTapped="lstrenewal_ItemTapped" VerticalOptions="FillAndExpand"  >
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <ViewCell>
                                <Grid Margin="0,0,0,0"  HorizontalOptions="CenterAndExpand"  BackgroundColor="#f2ffff"  >

                                    <Grid.RowDefinitions >
                                        <RowDefinition Height="Auto"/>
                                    </Grid.RowDefinitions>

                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="20*" />
                                        <ColumnDefinition Width="20*" />
                                        <ColumnDefinition Width="20*" />
                                        <ColumnDefinition Width="20*" />
                                        <ColumnDefinition Width="20*" />
                                    </Grid.ColumnDefinitions>

                                    <Label x:Name="lblboothno" Text="{Binding BoothNumber}" Margin="0,5,0,5" Grid.Row="0" XAlign="Center" Grid.Column="0" HorizontalOptions="CenterAndExpand"   FontSize="14" FontAttributes="Bold" TextColor="#348e8a" />

                                    <Switch x:Name="SWTrenweekly" Grid.Row="0" Grid.Column="1" Toggled="SWTrenweekly_Toggled"  Margin="20,0,0,0" HorizontalOptions="CenterAndExpand" IsToggled="{Binding AllowRenewal}"   />

                                    <Label x:Name="lblstrper" Text="{Binding RentStartPeriod_CUSTOMIZED}"  Margin="0,5,0,5" Grid.Row="0" XAlign="Center" Grid.Column="2" HorizontalOptions="CenterAndExpand"   FontSize="14" FontAttributes="Bold" TextColor="#348e8a" />

                                    <Picker x:Name="pckdate"    ItemsSource="{Binding clsrentals}"  SelectedItem="{Binding strdateid, Mode=TwoWay}" SelectedIndex="{Binding SelectedIndex}"  ItemDisplayBinding="{Binding strdates}" SelectedIndexChanged="pckdate_SelectedIndexChanged"  TextColor="#348e8a" Grid.Row="0" Grid.Column="3"    
                                    Title="Choose date" FontSize="12"   HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" BackgroundColor="Bisque" />

                                    <Label x:Name="lblrent" Text="{Binding Rent}"  Margin="0,5,0,5" Grid.Row="0" Grid.Column="4"  XAlign="Center" HorizontalOptions="CenterAndExpand"  FontSize="14" FontAttributes="Bold" TextColor="#348e8a" />

                                </Grid>

                            </ViewCell>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>

Here is my switch toggle event.

 private void SWTrenweekly_Toggled(object sender, ToggledEventArgs e)
        {
            try
            {
                string toggled = "";

                var switchItem = (Switch)sender;
                var selectedTask = (SaveWeeklyBookings)switchItem.BindingContext;
                var pickervalues = selectedTask.clsrentals;

                if (selectedTask != null)
                {
                    toggled = selectedTask.AllowRenewal;

                    if (toggled == "True")
                    {
                        string item = selectedTask.BoothNumber;

                        foreach (var values in pickervalues)  // Here i am getting values of all listview items but i want value of particular row 
                        {
                            var dateid = values.id;
                        }
                    }
                    else if (toggled == "False")
                    {

                    }
                }

            }
            catch (Exception ex)
            {

            }
        }

In above toggle event in pickervalues i am getting all the values which are bond to picker but i want particular selected index value please suggest.

This is my class file

    public class SaveWeeklyBookings
    {
        public string BoothNumber { get; set; }
        public string BoothType { get; set; }
        public string BoothTypeCategory { get; set; }
        public string Product { get; set; }
        public string ProductID { get; set; }
        public string RentalDate { get; set; }
        public string WeekDay { get; set; }
        public string Status { get; set; }
        public string ThisWeekStartDate { get; set; }
        public string ThisWeekEndDate { get; set; }
        public string AllowRenewal { get; set; }
        public string RentStartPeriod_CUSTOMIZED { get; set; }
        public string RentEndPeriod_CUSTOMIZED { get; set; }
        public string RentStartPeriod { get; set; }
        public string RentEndPeriod { get; set; }
        public string Rent { get; set; }
        public string SalesTax { get; set; }
        public string SecondLevelTax { get; set; }
        public int SelectedIndex { get; set; }

        public List<ClsRenWeeklys> clsrentals { set; get; }
    }
    public class ClsRenWeeklys
    {
        public string strdates { get; set; }
        public string strdateid { get; set; }
        public string lblweeklydate { get; set; }
        public int id { get; set; }
    }

Please guide

Best Answer

  • LandLuLandLu Member, Xamarin Team Xamurai
    edited November 2018 Accepted Answer

    Yes, of course you can. For the 2 what I mentioned above.
    Correct your ListView's SelectedItem, create a property in your SaveWeeklyBookings model: public ClsRenWeeklys SelectedItem { set; get; }. Then the bind should be:

    <Picker x:Name="pckdate" ItemsSource="{Binding clsrentals}"  SelectedItem="{Binding SelectedItem, Mode=TwoWay}" SelectedIndex="{Binding SelectedIndex}"  ItemDisplayBinding="{Binding strdates}" SelectedIndexChanged="pckdate_SelectedIndexChanged"  TextColor="#348e8a" Grid.Row="0" Grid.Column="3"    
    Title="Choose date" FontSize="12"   HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" BackgroundColor="Bisque" />
    

    At last get the value like: var selectedItem = selectedTask.SelectedItem;
    Moreover since you have gotten the selected row, you can also get the value using: pickervalues[selectedIndex].

Answers

  • ClintStLaurentClintStLaurent USUniversity ✭✭✭✭✭

    Personally I wouldn't key off the toggled event.
    The switch is binded to a property on the same model as the picker sources, right?
    So if you react to the bool property used by the switch, then you are already inside the same model as the picker you care about.
    So all the properties are in the model, same scope, making it easy to reference.

    If you deal with it at the Toggled event, then you are dealing with object data and logic at a UI layer - and that's just not right from an MVVM perspective.

  • LandLuLandLu Member, Xamarin Team Xamurai

    @DarshanJS I've seen you have bound the Picker's SelectedIndex to the binding context SaveWeeklyBookings model's SelectedIndex property. Since you have gotten the model using var selectedTask = (SaveWeeklyBookings)switchItem.BindingContext;, the Picker's selected row can be easily gotten: var selectedIndex = selectedTask.SelectedIndex;.

    Moreover just correct some other things:

    1. The Switch's IsToggled should be bound to a bool property, so change it to:
      public bool AllowRenewal { get; set; }
    2. The ListView's SelectedItem should be also bound to your SaveWeeklyBookings's property not the ClsRenWeeklys's. Or you will not get the corrected selected item.
  • DarshanJSDarshanJS USMember ✭✭✭✭
    edited November 2018

    @LandLu said:

    1. The Switch's IsToggled should be bound to a bool property, so change it to:
      public bool AllowRenewal { get; set; }
    2. The ListView's SelectedItem should be also bound to your SaveWeeklyBookings's property not the ClsRenWeeklys's. Or you will not get the corrected selected item.

    Yes i have bound SaveWeeklyBookings class to my Listview and ClsRenWeeklys to picker. As you said i am able to get selected index (selectedTask.SelectedIndex).
    But whether it is possible to get selected value of picker in switch toggle.

    @ClintStLaurent said:
    Personally I wouldn't key off the toggled event.
    The switch is binded to a property on the same model as the picker sources, right?
    So if you react to the bool property used by the switch, then you are already inside the same model as the picker you care about.
    So all the properties are in the model, same scope, making it easy to reference.

    If you deal with it at the Toggled event, then you are dealing with object data and logic at a UI layer - and that's just not right from an MVVM perspective.

    Yes, "just not right from an MVVM perspective" i agree with your comments but client is asking for the same requirement which i am trying

  • LandLuLandLu Member, Xamarin Team Xamurai
    edited November 2018 Accepted Answer

    Yes, of course you can. For the 2 what I mentioned above.
    Correct your ListView's SelectedItem, create a property in your SaveWeeklyBookings model: public ClsRenWeeklys SelectedItem { set; get; }. Then the bind should be:

    <Picker x:Name="pckdate" ItemsSource="{Binding clsrentals}"  SelectedItem="{Binding SelectedItem, Mode=TwoWay}" SelectedIndex="{Binding SelectedIndex}"  ItemDisplayBinding="{Binding strdates}" SelectedIndexChanged="pckdate_SelectedIndexChanged"  TextColor="#348e8a" Grid.Row="0" Grid.Column="3"    
    Title="Choose date" FontSize="12"   HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" BackgroundColor="Bisque" />
    

    At last get the value like: var selectedItem = selectedTask.SelectedItem;
    Moreover since you have gotten the selected row, you can also get the value using: pickervalues[selectedIndex].

  • DarshanJSDarshanJS USMember ✭✭✭✭

    Genius, Thank you so much you saved my time.

Sign In or Register to comment.