I have a ListView displaying a list of items containing mainly two properties.
Each of these properties should ideally be chosen from two comboboxes.
Moreover, the choices available in the second combobox is depends on the first.
So here is the idea of the code I used:
<ListView>
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel>
<ComboBox Name="combo1"
ItemsSource="{DynamicResource combo1Source}"
SelectedItem="{Binding FirstProperty}"
SelectionChanged="combo_SelectionChanged">
<ComboBox Name="combo2"
ItemsSource="{DynamicResource combo2Source}"
SelectedItem="{Binding SecondProperty}">
</StackPanel>
<DataTemplate>
<ListView.ItemTemplate>
</ListView>
The thing is, I don't know how to get the reference to combo2 from within combo_SelectionChanged (in C#).
Could you show me how to proceed?
The easiest thing you can do is add a Tag to combo1:
<ComboBox Name="combo1" Tag="{x:Reference combo2}" ... />
Which you then can just get from the sender in the event handler, e.g.
var combo2 = (sender as FrameworkElement).Tag as ComboBox;
Alternatively you could get the StackPanel from the Parent property and just take (ComboBox)Children[1]. I would not do this though as is breaks if the structure of your template changes.
You should not have a reference to combo2, but you should update the Collection combo2Source which is bound as ItemsSource for combo2...
So in the combo_SelectionChanged you just load the possible values for the actual selection of combo1 to the combo2Source Collection.
EDIT: To prevent thats its for all items the same:
Add a ValueConverter which choses for a selectedItem the corresponding collection of possible values:
<ComboBox ItemsSource="{Binding ElementName=Combo1, Path=SelectedItem, Converter={StaticResource SubSelectionConverter}}" />
Example of ValueConverter:
private Dictionary<Object, List<Object>> _PossibleValues;
public object Convert(Object data, ....)
{
if(PossibleValues.ContainsKey(data))
{
//return the possible values for the actual selected parent item
return(PossibleValues(data));
}
return null;
}
Can have look here on my question and different responses and the solution I found for my specific project:
Find an element in Data Template
Hope this helps.
Regards.
Related
I have a class PricingData and PricingSchedule. Where PricingSchedule is a List<> inside PricingData class. I want to bind data of this class to UWP controls.
Sample code is available to download here : https://github.com/jigneshdesai/SampleOfBindingIssue1.git
How Code looks: i have a start page(mainpage) that hosts ListView control, Listview has PricingUserControl within it. PricingUserControl looks like this
<TextBlock x:Name="lblPriceHeader" Text="{Binding PricingTitle}" Margin="0,0,50,0" />
<ComboBox x:Name="cbPriceValueList" ItemsSource="{x:Bind dpl}" DisplayMemberPath="PriceValue" SelectedValuePath="PriceValue" SelectedValue="{Binding DisplayPricing}" />
<ListView x:Name="lbPriceChangeSchedule" ItemsSource="{Binding PricingScheduleList}">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel>
<StackPanel Orientation="Horizontal">
<ComboBox x:Name="cbSchedulePriceValueList" ItemsSource="{x:Bind dpl}" DisplayMemberPath="PriceValue" SelectedValuePath="PriceValue" />
<TextBlock Text="{Binding SchedulePricingTimeZone }" />
</StackPanel>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
What i want to achieve: Combobox should populate a list of values (eg. 1USD, 2USD, 3USD etc.). Then when you provide List of records from database, the listbox will repeat PricingUserControl and combobox within it should set its value property (SelectedValue) as per record.
Issue:
ComboBox x:Name="cbPriceValueList" uses x:bind dpl where dpl is a local variable of PricingUserControl. It populates the list properly. The trouble is ComboBox x:Name="cbSchedulePriceValueList" it also has x:bind dpl but during compilation it display error "Invalid binding path 'dpl' : Property 'dpl' not found on type 'DataTemplate'."
I am wondering why x:bind dpl does not work at this point. ?
I have now realized that your problem is in fact that you need to reach to a Page property from within the DataTemplate, so here is a updated answer.
You cannot use x:Bind if you need to access an outside element's property from within a DataTemplate. Instead, you can use classic {Binding} expression. First add a name to your page:
<Page
...
x:Name="Page">
And now refer to this name from within the DataTemplate:
<ComboBox
x:Name="cbSchedulePriceValueList"
ItemsSource="{Binding ElementName=Page, Path=dpl}"
DisplayMemberPath="PriceValue"
SelectedValuePath="PriceValue" />
Original answer
To be able to use x:Bind inside of a DataTemplate, you must specify the data type the individual items of the control will have, using x:DataType. Suppose your PricingScheduleList is a List<MyApp.Models.MyType>, then you will first need to add this XML namespace to the <Page> element:
xmlns:models="using:MyApp.Models"
And then set the x:DataType attribute as follows:
<DataTemplate x:DataType="models:MyType">
...
</DataTemplate>
You can confirm this works by the fact that IntelliSense should now suggest you the properties of MyType when you start writing the x:Bind expression.
By checking your code, the reason why SelectedValue does not take effect is when you choose the item from ComboBox, you didn't notify your DisplayPricing to change. So you need to implement INotifyPropertyChanged interface in your PricingData. Do the same behavior in PricingSchedule.
public class PricingData : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged = delegate { };
......
public string DisplayPricing
{
get => $"{PricingValue} {PricingCurrency}";
set
{
var sp = value.Split(' ');
PricingValue = sp.First();
PricingCurrency = sp.Last();
OnPropertyChanged();
}
}
public void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
PScheduleUserControl.xaml:
<ComboBox x:Name="cbPriceValueList" ItemsSource="{x:Bind myList}" DisplayMemberPath="PriceValue" SelectedValuePath="PriceValue" SelectedValue="{Binding DisplayPricing,Mode=TwoWay}" />
I am trying to bind a ListBox to another ListBox within the same window. The left hand sided Listbox has data in it that one can select. But I want a user to be able to click on the item(s) in the left hand listbox and those same item(s) would be displayed in the other listbox on the right hand side.
EDITED: Of course you can bind a UI property to another UI property (Dependency Property actually) using ElementName, but I recommend to bind the properties to one view model. See a simplified example below.
View model:
public ObservableCollection<ItemObject> Items { get; set; }
public ObservableCollection<ItemObject> SelectedItems { get; set; }
Left:
<ListBox ItemsSource="{Binding Items}" SelectedItems="{Binding SelectedItems}" />
(Note that there is no SelectedItems dependency property actually. See question like: Select multiple items from a DataGrid in an MVVM WPF project)
Right:
<ListBox ItemsSource="{Binding SelectedItems}" />
This works fine. Furthermore, with this approach, the list on the right hand can be customized with ease (eg order, filter, ... by using CollectionView).
private ICollectionView _collectionView;
private ICollectionView _CollectionView {
get { return _collectionView
?? (_collectionView = CollectionViewSource.GetDefaultView(SelectedItems)); }
}
public ICollectionView FilteredItems {
get { _CollecitionView.Filter(...); }
}
<ListBox ItemsSource={"Binding FilteredSelectedItems"} />
Such an MVVM approach is sometimes laborious, but eventually found as beneficial.
You name the first listbox, then any other control on the xaml will bind to that control using it's name in the ElementName attribute of the binding.
For example there are two listboxes and one text box. The top listbox has multiselections and those selection(s) are shown on the lower listbox. While the textbox only gets the first item selected.
<StackPanel Orientation="Vertical">
<StackPanel.Resources>
<converters:PathToFilenameConverter x:Key="FilenameConverter" />
<x:Array x:Key="FileNames" Type="system:String">
<system:String>C:\Temp\Alpha.txt</system:String>
<system:String>C:\Temp\Beta.txt</system:String>
<system:String>C:\Temp\Gamma.txt</system:String>
</x:Array>
</StackPanel.Resources>
<ListBox Name="lbFiles"
SelectionMode="Multiple"
ItemsSource="{StaticResource FileNames}"
Margin="10"/>
<ListBox ItemsSource="{Binding SelectedItems, ElementName=lbFiles }" Margin="10" />
<TextBlock Text="{Binding SelectedItem,
ElementName=lbFiles,
Converter={StaticResource FilenameConverter}}"
Margin="10" />
</StackPanel>
Note...the code is binding using the SelectedItems property for the lower list box and not SelectedItem used by the TextBlock.
As an aside, another answer has the use of an ObservableCollection, that is not needed unless the array is dynamically changing; otherwise any array can be used. Depending on loading, say from a VM, it may need to adheres to the INotifyPropertyChanged.
I have a user control that has one dependency property. In my window I have a list of objects, and I am creating a uniform grid consisting of my user control. I am setting the ItemsSource to my list of objects, but I need to pass each respective object to the user control. Please see the code below - I need to pass in the Participant object to the LadderControl.
<ItemsControl Grid.Row="2" Name="Participants" ItemsSource="{Binding Path=MyEvent.Participants}">
// more code here, irrelevant
<ItemsControl.ItemTemplate>
<DataTemplate>
<ladder:LadderControl Participant="CURRENT_ITEM_IN_PARTICIPANTS_LIST"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
Is there a way I can do this ? Should I be thinking about using a different pattern ?
Thanks
Just do the below, as the Participant is the context of each item
<ladder:LadderControl Participant="{Binding}"/>
You can simply access the DataContext Property in LadderControl to access the currrent participant.
There is no need for a separate dependency property.
class LadderControl
{
...
public IParticipant Participant
{
get{ return DataContext as IParticipant; }
}
...
One solution is to simply do:
<ladder:LadderControl Participant="{Binding Path=.}"/>
{Binding Path=.} should bind to the current element in the ItemsSource list.
Im trying to bind a list of images to a Listbox, but all I get is a list of Type names
<ListBox x:Name="PhotosListBox" ItemsSource="{Binding MyImages}" />
The MyImages is a List<BitMapImages>
Right now It just returns a list of System.Windows.Media.Imaging.BitmapImage instead of showing the Images
EDIT
For further ref, here is the final code.
<ListBox x:Name="PhotosListBox" ItemsSource="{Binding MyImages}" >
<ListBox.ItemTemplate>
<DataTemplate>
<Image Source="{Binding}" Stretch="Uniform"></Image>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
By default, the ToString() method of the bound data type will be invoked, which by default will return the fully qualified type name.
You should define a custom ItemTemplate for the ListBox.
You need to use an ItemTemplate other than the default so that the ListBox knows how to handle the data type being passed to it.
See: http://msdn.microsoft.com/en-us/library/ms742521.aspx
I'm using silverlight framework 4: I'm trying to list my items in a generic list to a listbox control: But the only data a receive is the classname itself.
lsBox => the listbox control
lsTags => generic type
My question is: how can I add my items in the generic list, to the listbox control?
my code is:
lsBox.ItemsSource = lsTags;
You can use DisplayMemberPath and SelectedValuePath properties of your ListBox control to tell ListBox which property's value should be displayed for every item and which property should be used for determening ListBox.SelectedValue property. Or use ListBox.ItemTemplate to display a complex data like this:
<ListBox x:Name="usersInGroupLBox">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<CheckBox IsChecked="{Binding IsActive, Mode=TwoWay}" />
<TextBlock Text="{Binding User.UserName}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Do not forget, you can use only public properties for binding. Check you class Tag.
The default behavior of ListBox (and most other controls) for displaying user types is to call the ToString() method. The default behavior of that is to display the class name.
What you should do depends on what you want to display, but if it's something simple like displaying the value of the Name property, just set the DisplayMemberPath property:
<ListBox Name="lsBox" DisplayMemberPath="Name" />