ComboBox IsEditable Behavior question WPF - wpf

<ComboBox IsEditable="True" SelectedItem="{Binding}">
<ComboBoxItem>Angus/ComboBoxItem>
<ComboBoxItem>Angie/ComboBoxItem>
<ComboBoxItem>Jane</ComboBoxItem>
<ComboBoxItem>Steve</ComboBoxItem>
</ComboBox>
I would like to allow the user to find their selection by typing in a name, so I have set IsEditable equal to true.
Now my question regarding behavior is this:
When I start typing Ang...I would expect to see BOTH Angus and Angie in the dropdown....however, I only see Angie first and I dont see Angus until I enter Angu ... .
Can we replicate this behavior like in google search autocomplete box.?
Thanks!

IMO you can't do it with the regular ComboBox, but the good news are:
There's an excellent autoCompleteBox in the WPF toolkit.
this is an example how to use it:
http://www.c-sharpcorner.com/UploadFile/dpatra/537/

Related

XAML - Relatively Position Control Outside of Document Flow

I'm looking to create a UI element in a WPF XAML UserControl with something that looks and works roughly like Google Suggest - a TextBox with a ListBox that appears beneath it showing suggestions that match the text entered in the TextBox. In simplified form, my XAML looks like this:
<StackPanel>
[...controls above...]
<TextBox ... />
<ListBox ItemsSource="{Binding SearchHints}"
Visibility="{Binding HasSearchHints}" MaxHeight="100" />
[...controls below...]
</StackPanel>
What I'm struggling to achieve is I want the ListBox to float above any content that may come below it, much like the dropdown part of a ComboBox does. Currently it pushes any controls below it downwards. I figure this must be possible because the ComboBox control essentially does exactly what I want to do. In CSS it would be a matter of setting the element to position:relative but there doesn't seem to be an immediately obvious equivalent in XAML. Any ideas?
Used Icepickle's comment - the element did exactly what I wanted.

Binding to Dataset Selected Row

Is there any way bind textboxes to the row of a dataset that is selected in a combobox? For example I have a dataset with 2 columns, one called name (this is the primary key) and the other is called author. I would like to set up databinding so that when the user selects the name in the combobox the corresponding author appears in the text of a textbox.
Specifically I want to know if this can be done through databinding or if it will require code for the selecteditemchanged event, or if it should be done using a value converter.
I think it would be possible to do with a value converter, but I was hoping it could be accomplished entirely in XAML.
This turned out to be a good tutorial to follow for building the appropriate code using the visual studio wizards for all the data stuff.
http://msdn.microsoft.com/en-us/library/dd547149.aspx
Try this:
<TextBox Text="{Binding ElementName=comboboxName, Path=SelectedItem.author}" />
comboboxNameis Name attribute of your ComboBox
.author is field name
Yes you bind to ElementName and then for path SelecteItem.PropertyName. Search MSDN on .NET Binding ElementName.

SelectedItem of SelectedItem

first of all I would like to thank you for the many good posts that i read in this forum. Unluckily I could not find anything of help for my current problem (either here or anywhere else).
What I'm trying to do sounds quite simple, but I have no clue how to get it to work ... perhaps I'm still to new to wpf or I don't thing wpfy enough :)
I'm designing a front end for a part in an automated manufacturing:
I have a quantity of places where pallets can be put (but it can be empty as well).
Each pallet has up to 3 places where parts can be mounted
Everything is created dynamically of a database and is reacting to changes.
The position of the parts on the pallet comes from the database as well and should be visualized
What I would like to have is:
An overview over the pallet-places with a preview of the pallet
When I select a place I want to see a detail view of the place
When I click on a part on the pallet of the detailed pallet I want to see details to the part
The first two points are quite simple and work nicely:
I have got a DataTemplate for every component (part, pallet, pallet-place). Actually those are UserControls that are imported as Datatemplates
the overview is a ListBox with the places as DataContext
for the detail-place-view I use the UserControl and bound it to the SelectedItem of the Listbox
I tried to bind the Text of a Textblock to the ID of the selected Part ... and fail.
Probably I could use some global variables in the code behind - but that sound very ugly.
Can anybody help?
I have got a solution ... it is not nice but works.
I created an event in the pallet, that triggers, when the selected part-place changes
I handle the event in the pallet-place and create a new one
And finally I handle it in the overview and change the detailview accordingly
Most likely there are much nicer solutions, but it will suffice.
Perhaps try an ElementName binding?
<TextBlock Text="{Binding ElementName=Name_of_your_Listbox, Path=SelectedItem.ID" />
Can you post a bit more code of your TextBlock and your Binding?
Context is important, if i use a ContentControl and bind its content to the SelectedItem like this:
<ContentControl Content="{Binding SelectedItem, ElementName=mylistbox}">
I can bind to the ID of the selected item in the DataTemplate like this:
<ContentControl.ContentTemplate>
<DataTemplate>
<TextBlock Text="{Binding ID}" />
</DataTemplate>
</ContentControl.ContentTemplate>
That is because setting the Content of the ContentControl automatically sets the DataContext as well, and this binding is relative to the DataContext since no source (ElementName, RelativeSource, Source) has been specified.
I do not know how your UserControl handles the context, if the DataContext is not affected such bindings will not work. You would need to bind directly then:
<uc:MyDetailsView Data="{Binding SelectedItem, ElementName=mylistbox}">
<!-- ... -->
<TextBlock Text="{Binding SelectedItem.ID, ElementName=mylistbox}" />
This of course defeats the purpose of having the binding on the UserControl itself in the first place. But unless you post some relevant code it's quite hard to tell what is wrong.
Also check the Output window in VisualStudio, binding errors will show up there and might provide valuable information as to what went wrong.

Multiline for WPF TextBox

I am developing an app for sending some feedback.
Basically I'm trying to make a TextBox for comments, but I'm used to the WinForms MultiLine=true. I've set MinLines to 3, which is getting there, but preferably I'd like it if the user is able to type wherever in this block - like press enter and do dot points sort of thing. For example:
- Item 1 blah
- Item 2 blahlb lahbvl d
But at the moment the text all stays on one line.
- Item 1 blah - Item 2 blahb blahb blah
These comments will then help fill the body of an email which is sent. It may be pointless if I can't easily keep the same formatting when putting this string into the email body string (so that it looks like it does when sent as it does when typed).
Can I achieve what I'm after or do I have to leave it as all text on one line?
Enable TextWrapping="Wrap" and AcceptsReturn="True" on your TextBox.
You might also wish to enable AcceptsTab and SpellCheck.IsEnabled too.
Also, if, like me, you add controls directly in XAML (not using the editor), you might get frustrated that it won't stretch to the available height, even after setting those two properties.
To make the TextBox stretch, set the Height="Auto".
UPDATE:
In retrospect, I think this must have been necessary thanks to a default style for TextBoxes specifying the height to some standard for the application somewhere in the App resources. It may be worthwhile checking this if this helped you.
Here is a sample XAML that will allow TextBox to accept multiline text and it uses its own scrollbars:
<TextBox
Height="200"
Width="500"
TextWrapping="Wrap"
AcceptsReturn="True"
HorizontalScrollBarVisibility="Disabled"
VerticalScrollBarVisibility="Auto"/>
The only property corresponding in WPF to the
Winforms property: TextBox.Multiline = true
is the WPF property:
TextBox.AcceptsReturn = true
or
<TextBox AcceptsReturn="True" ...... />
All other settings, such as VerticalAlignement, WordWrap etc., only control how the TextBox interacts in the UI but do not affect the Multiline behaviour.
Contrary to #Andre Luus, setting Height="Auto" will not make the TextBox stretch. The solution I found was to set VerticalAlignment="Stretch"

Fixing Tim Heuer's EditableComboBox for SL3 & latest SL Toolkit

I'm using Tim Heuer's style to get an editable combo box from here:
http://timheuer.com/blog/archive/2008/11/05/silverlight-editable-combobox-using-styles.aspx
This is working well in my project circa the previous release of the Silverlight Toolkit. Unfortunately, attempting to use this style with SL3 RTM and the latest SL Toolkit doesn't work. I suspect that the problem has to do with this: "Breaking Change: The "DropDownToggle" template part of type ToggleButton has been removed." I'm not sure how to fix it to get the drop down part to work again, any ideas?
For me it works now. I added this line to ToggleButton declaration in EditableComboStyle template:
IsChecked="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsDropDownOpen, Mode=TwoWay}"
Also it is important to change the ListBox name to x:Name="Selector" in the same EditableComboStyle template like Jeff said. Then the control is used as:
<toolkit:AutoCompleteBox MinimumPrefixLength="0"
MinimumPopulateDelay="200"
x:Name="editableCombo"
Style="{StaticResource EditableComboStyle}"
Text="{Binding MyProperty, Mode=TwoWay, NotifyOnValidationError=True, ValidatesOnExceptions=True}" />
But unfortunately when the desired editable combobox behavior works, other issues appears:
I have problem with immediate binding when user click on toogle button which causes immediate validation before any item is selected or text written.
User have to press tab twice for move to other control.
If you take a look inside of the Silverlight Toolkit C# samples (for the latest July 2009 release), you'll see that the editable combo box sample has changed some. You are correct that the breaking change is the reason for this.
The ToggleButton still exists in the custom template for the control, but you need to hook up to the Click event in your code-behind file, and actually toggle the IsDropDownOpen value in your code.
This change was made to be consistent: having the control support template parts that are not in the default control template was decided to be against good design guidelines for controls, so I removed it for the final release of Silverlight 3.
I'm sorry it's caused some trouble, and hope that updating your application is easy enough!
Also, be aware that in any custom control templates, with the July 2009 release of the Silverlight Toolkit for Silverlight 2 (or the Silverlight 3 SDK), the AutoCompleteBox's ListBox template part has been renamed to "Selector" from "SelectionAdapter", so you may need to rename your ListBox template part in your own styles.
I had a bit of trouble putting the fixes together for SL3 (I couldn't find it in one place) so for anyone else I will leave my working version here:
http://walkersretreat.co.nz/files/SLComboEdit3.zip
This includes the fix for the tabstop.
There is nothing new in here - just put together what others have said in one place.
Khyalis on Tim Heuer's blog seems to have fixed this by binding IsChecked on the DropDownToggle:
IsChecked="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsDropDownOpen, Mode=TwoWay}"
So far it works for me.
IsTabStop=false on the AutoCompleteBox will fix the tab issue.
The TextBox (inside the AutoCompleteBox template) will still get focus on tab.

Resources