WPF Listbox Selection change not firing on Item click - wpf

In my wpf application when I select listboxItem, SelectionChanged event of listbox is not firing. However event fires when I click on outer margin.
have a look at below snap.
so basically, when I click on section inside Red border(Right Image), Selection change event is not firing, but when I click on outer border (White color part), selection change fires.
While searching about issue, I am not sure but I found it may be issue due to event tunneling. However I have only a bit of knowledge about tunneling yet.
So can any one please help me how this can get working so that selection change fire when I click on listboxitem (Red section)
let me if I need to further clear question.
I am also putting listbox code here
<ListBox x:Name="Listbox1" SelectionChanged="listBox1_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<ListBoxItem Margin="10" Content="{Binding Name}" Height="25"
BorderBrush="#FF404040" BorderThickness="0,0.25" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Thanks in anticipation

I can't think of a reason why you would want to have a ListBoxItem inside the DataTemplate of a ItemTemplate. The ListBoxItems are genarated automatically for each element of the ListBox and whatever you have in your DataTemplate will be used as the content of that ListBoxItem So in your case you end up having a ListBoxItem inside a ListBoxItem. This might be the cause.
Try it this way:
<ListBox x:Name="Listbox1" SelectionChanged="listBox1_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<Label Margin="10"
Content="{Binding Name}"
Height="25"
BorderBrush="#FF404040"
BorderThickness="0,0.25" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

Related

Adding a small popup on a wpf listbox that is already using itemsource

Here is a portion of my wpf-xaml code :
<ListBox x:Name="TestJobSuiteListBox" Grid.Row="1" ItemsSource="{Binding AvailableJobs}" MouseRightButtonDown="TestJobSuiteListBox_OnMouseRightButtonDown">
<ListBox.ItemTemplate>
<HierarchicalDataTemplate>
<ListBoxItem Content="{Binding Name}"/>
</HierarchicalDataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I would like to add another listboxitem to that ListBox and I dont want it to be visible before you rightclick on the listbox. It also should not be bound to the "AvailableJobs" property.
Something like this :
<ListBox x:Name="TestJobSuiteListBox" Grid.Row="1" ItemsSource="{Binding AvailableJobs}" MouseRightButtonDown="TestJobSuiteListBox_OnMouseRightButtonDown">
<ListBox.ItemTemplate>
<HierarchicalDataTemplate>
<ListBoxItem Content="{Binding Name}"/>
</HierarchicalDataTemplate>
</ListBox.ItemTemplate>
<ListBoxItem x:Name="AddJobbListBoxItem" Visibility="Hidden"></ListBoxItem>
</ListBox>
This doesn't work, because of "itemsource must be empty problem"
Anyone have a good Idea of how I could do it ?
I don't need help with the visibility/rightclick functionality.
Thanks in advance, I hope the problem is understandable.
You can put listbox to stackPanel, and disable it's scrolling. Then add that one element also to the stackPanel under the listbox, and finally add that stackPanel to scrollViewer. Then you have listbox with AddButton.
<ScrollViewer>
<StackPanel>
<ListBox ItemsSource="{Binding AvailableJobs}"
ScrollViewer.VerticalScrollBarVisibility="Disabled">
<!-- ... -->
</ListBox>
<Button x:Name="AddJobbButton" Visibility="Collapsed" />
</StackPanel>
</ScrollViewer>
Notice that if you have lots of items in listbox, there might be some performance problems, because I'm not sure that listbox's virtualizing is working correctly if it's in stackPanel.
EDIT: of course you have to listen mouse events and set then button's visibility to visible and so on...
I think you have to use ItemTemplateSelector to achieve this functionality. You can create different DataTemplate as per your requirement in the Resources section and bind properly in the xaml. Check the answer here, it will give you the idea about the approach. Please refer this examlpe also. Hope this will help.

SelectedItem of ListBox with DataTemplate

I have a Listbox with DataTemplate. The DataTemplate contains UserControl element. If I clicked on the UserControl element the Item, which contains this UserControl does not become the SelectedItem of the ListBox. If I clicked anywhere in the area of item except it's UserControl, it is selected.
How can I select the item of ListBoxby clicking on the area belongs item's UserControl?
<ListBox ItemsSource="{Binding ListOfQuestion, Mode=TwoWay,
UpdateSourceTrigger=PropertyChanged}"
Grid.Row="1"
HorizontalContentAlignment="Stretch"
x:Name="ListOfQuestion"
SelectedItem="{Binding SelectedQuestion, Mode=TwoWay}">
</ListBox.Resources>
<ListBox.ItemTemplate>
<DataTemplate>
<local:usc_QuestionEdit x:Name="QuestionList"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Sounds like the user control is catching the mouse click and not the listbox. That is why it doesn't get selected. If you are using code-behind, you can use the events with the Preview prefix to catch the click higher in the control hierarchy.
To learn more about this events read about Routed Events on MSDN
Update: This post seems to have the answer you are looking for.
Hope this helps

ListBox is selecting more than one item when it is being dragged

I have a ListBox with RadioButton inside it of the same GroupName.
Like so:
<ListBox x:Name="AnswerListBox" DataContext="{Binding .}" ItemsSource="{Binding Answers}" Width="auto" HorizontalAlignment="Center" >
<ListBox.ItemTemplate>
<DataTemplate>
<local:spriteToggleButton DataContext="{Binding .}" HorizontalAlignment="Center" Text="{Binding text}" Selected="{Binding selected}" Sprites="{Binding Path=DataContext.UISprites, ElementName=questionField}" IsChecked="{Binding selected, Mode=TwoWay}" GroupName="{Binding Path=DataContext.QuestionTitle, ElementName=questionField}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
When I click on a RadioButton it will unselect another in that group, this is fine.
But when I do a swipe down on the ListBox it will select more than one RadioButton which is an unwanted behavior.
There might be more than one way of changing that behavior.
I don't need it to scroll up and down the list as I will only show as many items as will fit on screen. so maybe that behavior can be disabled.
Maybe a callback could incur when the ListBox is scrolled and something could disable selection when dragging in being done.
the DataContext to the listbox is of List<> so is there a way to change the setter of my Selected variable in my List<> so that it unsets the other values in that list.
Set ScrollViewer.VerticalScrollBarVisibility to "Disabled" on the ListBox element.
In the SelectionChanged event, set the SelectedIndex to -1
You could clear all the other values in the ItemsSource in the SelectionChanged event.

Listbox within Listbox and scrolling trouble in Windows Phone 7 Silverlight

I have a Windows Phone 7 Silverlight application that has a listbox and within the item template it binds another listbox.
<ListBox x:Name="CouponsGrouping">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="Expires" />
<ListBox ItemsSource="{Binding Coupons}" Margin="0,10,0,0">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<HyperlinkButton Content="{Binding StoreName}" HorizontalAlignment="Left"/>
<TextBlock Text="{Binding CouponText}" Style="{StaticResource PhoneTextNormalStyle}" />
<TextBlock Text="{Binding CouponType}" Style="{StaticResource PhoneTextNormalStyle}" />
<Button Content="Press me" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
When I try to scroll (click and drag) the list from within the inner listbox the parent listbox doesn't scroll. If I scroll by clicking on the "Expires" texbox it scrolls fine. How can I make it so that when I scroll the inner listbox the parent listbox scrolls instead.
Thanks, in advance.
On your child listbox add ScrollViewer.VerticalScrollBarVisibility="Disabled". This prevents the undesired scrolling behavior.
Hey Jonas - Kevin from Tampa, actually I was just looking up this same question. I don't think this is really a poor UX based upon usage. What I did to resolve this was to actually use a grid rather than a stack panel for the data template of the outer ListBox. Then after I put the nested ListBox in the outer DataTemplate, I put a Rectangle with a transparent fill. You just need to make sure your Rectangle is tall and wide enough to mask the inner ListBox. My nested ListBox only has 2-3-4 items so it's really not an issue.
Make sense?

[WPF]ItemsControl not completely loaded #Loaded event

I have a probably simple problem, that I just can't seem to figure out:
I've made an ItemsControl which has its datacontext set and shows the data as pairs of Checkboxes and TextBlocks:
<ItemsControl Name="listTaskTypes" Grid.Row="1" Grid.Column="2" Grid.RowSpan="2" ItemsSource="{Binding}" Margin="10,0,0,0" VerticalAlignment="Top" Loaded="listTaskTypes_Loaded">
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<CheckBox Name="checkBoxTypeId" Tag="{Binding Path=TaskTypeID}"/>
<TextBlock FontSize="11pt" FontFamily="Helvetica" Text="{Binding Path=Text}" />
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
My problem is that in the Loaded event of the ItemsControl, the checkboxes do not exist yet. How can I get an event when the ItemsControl is completely loaded or is this not possible?
listTaskTypes.ItemContainerGenerator.StatusChanged event handler can give you the notification on each item created on the ItemsControl.
Yeah Loaded is just the ItemsControl loaded event, the items might not have created at that moment. Just curious as to what you are trying to achieve here?. I guess you are trying to get the instance of CheckBox in the code behind? There may be better way using binding to achieve what you are looking for.
Try the DataContextChanged event!
When the DataContext changes, the control should be Loaded, and you can be sure it has a DataContext set as well.
Hope this helps

Resources