I'm getting there with this WPF validation, IDataErrorInfo, INotifyPropertyChange stuff, but new issue on refresh. I have a window with a bunch of controls on it. I have a tabbed page interface and for simplicity have 2 pages... 5 controls on each.
I start to "Add" a record, so all fields are blank. Ex: 3 of the fields on the first page that require validation are properly flagged as red border to indicate they are required... no problem.
Now, I click on to page 2 and immediately back to page 1. The red borders are all gone. They don't reappear red unless I explicitly tab through them to re-focus them, lose focus and force it to do its lostfocus / property changed validation via IDataErrorInfo.
First, any explanation WHY WPF is losing what the first page looks like just because it has to change page 1's visiblity to show page 2, and then back to page 1.
Second, suggestions on how to force the controls to be properly refreshed with the red border indicating they are required.
Thanks
Just put the controls you validate inside an AdornerDecorator an it will work fine ;)
<TabItem>
<AdornerDecorator>
<Grid>
<TextBox>
</TextBox>
...
</Grid>
</AdornerDecorator>
</TabItem>
If I recall correctly, the default error validation markers for controls are just red boxes overlaid over the top of the control, not part of the control itself, so the visibility of that overlay does not persist if the control is hidden. You might try changing the control template to incorporate a red border / label directly as part of the control, and that issue might be cleared up.
To force all your bindings to refresh (and therefore their validation) all you need to do is call RaisePropertyChanged again for any property you want to re-validate. It's a little wasteful, but you can just call RaisePropertyChanged with an empty string as parameter, and it will raise for all properties in the viewmodel.
Related
Is there a way to make an entire WPF Window inert after a button click?
The window is invoked via Window.ShowDialog() and after use, the window is no longer needed for interaction but I leave it open to remind the user of the inputs in TextBox's, ListBox's, and give visual feedback via OxyPlot and so on. I leave it to the user to close the window manually.
One solution is to disable all buttons but that's tedious and it still leaves TextBox's functioning. That's not optimal because for anything to be functioning creates the wrong impression that the Window remains for anything other than looking at. It would be better for every control to be non-functioning by a single setting.
I did it by putting a name on the WPF window code behind and then setting .IsEnabled false upon the appropriate button click. All buttons, combo boxes, text boxes, and even OxyPlot became inert at that point and most parts were greyed out.
Consider creating a dedicated boolean dependency property in your code-behind or viewmodel and binding IsEnabled of every TextBox to the property.
In my window I have 2 tabs. One with the main informarion and the other one with an editable grid. When I click the save button the entire window gets validated and the controls with validation problems are highlighted in red. But if i change the tab to the one with the grid and get back to the one with the validation problems the controls are not highlighted anymore. Even if i click the save button again, and the validation happens, the controls never get highlighted again.
Here are the screen captures
it's a bit late, but today I had the same situation and found the solution.
You have to add a AdornerDecorator inside the TabItem:
<TabItem Header="Foo">
<AdornerDecorator>
//more content
</AdornerDecorator>
</TabItem>
I have found it in a more general question:
TextBox with validation loses ErrorTemplate on tab change
Greetings
FindAncestor RelativeSource only supports 'Self' and 'TemplatedParent',
but I have to bind the width of a popup to the width of the page.
Giving the page a name causes problems because sometimes it will
throw exceptions saying a control with that name is already present in the visual tree.
<Popup IsOpen="True"
Width="{Binding ElementName=BordPage, Path=Width}"
Height="{Binding ElementName=BordPage, Path=Height}">
Background information:
I'm using a SL4 navigation based application here. BordPage is a navigation page,
which I'm using multiple times within the application. So giving it a name in the page itself is not really a good idea,
but I don't know how else I can bind to the width and height of the page.
What I'm trying to do is have a black border (with opacity 0.8) cover the entire screen,
(including the controls of the MainPage). Then on top of that I want to display some other controls.
Since the application is touch controlled, providing the user with a ComboBox to select a value doesn't really work wel. Instead I want to show this black overlay window with a listbox taking up most of the screen so the user can simply touch the value he wants with a single click.
Update: I just realized I can use the ChildWindow class to do this.
But my original question remains.
My general solution for this problem is by writing a custom behavior. It's not a pure XAML solution but it gives you a lot more flexibility.
Create a behavior that searches up the VisualTree to find the right item and then have it set the width of the Popup correctly.
It may be a little more complicated than a straight binding but it avoids all the naming issues.
Put the following in the constructor of your control so you can avoid naming it:
DataContext = this;
I have implemented my MVVM error message as a message dialog that subscribes to error messages via a mediator class, so that other viewmodels can notify it if any errors occur.
When an error occurs, I set the visibility attribute in the viewmodel to Visible, to display the error window. This is all bound in the Error window from the viewmodel.
However, this window is NOT modal! I need to show it as a dialog and not just set the visibility to true - is there any kind of binding I can do, even if I have to extend the functionality of the window? I'd rather not break MVVM if I can avoid it.
Thanks!
The View/ViewModel split is meant to divide look from functionality. I firmly believe the Window is functionality and look rolled into one. For instance, what if in your ErrorMessageViewModel, you had this code that executes when there are errors:
class WindowViewModel : Window
{
}
.
.
.
WindowViewModel newDialog = new WindowViewModel();
newDialog.Content = myErrorListViewModel;
newDialog.Parent = mainWindowViewModel;
newDialog.ShowDialog();
So the contents of the dialog is the ViewModel for your error list. Define your View as a data template that automatically applies itself to the error list ViewModel.
Doesn't that look like MVVM?
The fact is, the Window class is a ViewModel for the Window you see on the screen. By changing the properties of the Window object, it affects the "view" just like if the properties of the WindowView were bound to a WindowViewModel. The only thing missing is the ability to "restyle" the Window using WPF, and it doesn't matter how hard you try to implement it, you're not going to be able to do that. The user can restyle a Window by modifying their desktop theme, but you're not in control of it. The best you can do is turn off the chrome and/or make it full screen.
You find an example how windows (don't matter if they are modal or not) are shown, in the ViewModel example of this project:
WPF Application Framework (WAF)
http://waf.codeplex.com
I am also working on a MVVM project where I need modal dialogboxes or messageboxes. I have found the following way of solving it:
The software uses only one window. The layout root element is a Grid with no row- or columndefinitions. The grid has three children:
A dockpanel that contains all the usual stuff like menus, tabbed views, status bar and so on.
A grid that has a gray background and a 50% opacity. This is used as a veil to cover the dockpanel when a modal box is in effect. The veil grid is usually collapsed.
A grid holding modal views, this is usually collapsed.
The viewmodel for the main window has a member called Modal. If this is null, the two grids for modal use are collapsed through databinding and a converter for Visibility.Collapsed.
When the program wants to display for example a modal message box, a MessageBoxViewModel is instantiated and assigned to MainViewModel.Modal. The MessageBoxViewModel has a Command for an OK-button. This Command raises an event that sets the MainViewModel.Modal to null again.
The veil grid occludes the main DockPanel, so that no controls outside the Modal control accept input.
Your program can either run a messagepump until OK is pressed, or the OK-Command can trigger the next. There are many ways of solving different needs, but the Model-ModelView solution should support them.
I feel that this is as good a model of the view in the modal mode as one can hope for.
I made a behhavior to tie some modal dialogs to the command.
http://www.clr-namespace.com/post/MVVMModal-dialog-before-running-Command.aspx
<Confirm:Confirm IsConfirm="{Binding ElementName=checkBoxConfirm, Path=IsChecked}"
Command="{Binding Path=ButtonCommand}"
CommandParameter="{Binding ElementName=textBoxParameter, Path=Text}"
ConfirmMessage="Are you sure you want to fire the command?"
ConfirmCaption="Question" >
</Confirm:Confirm>
In my recent blog post you can find simple solution for Modal Dialogs and Message Boxes in MVVM for Silverlight but this can be simply reused in WPF:
Modal dialogs with MVVM and Silverlight 4
i'm using the same method as Scott Whitlock.
there is just one more important property to set:
class ModalDialog: Window
{
}
.
.
.
var dlg = new ModalDialog {
Content = viewModelName,
**TopMost = true,**
Parent = mainWindowViewModel
};
dlg.ShowDialog();
I have a custom UserControl which tries to recreate auto-complete for a textbox. When user types, the text is used to filter a provided collection of items and then a Popup displays a ListBox with items that match what user have typed.
Unfortunately, if user decides to switch away from the application to another window (browser, MSWord, anything!), the Popup remains on top of every other window!
Also, if I move my window (which hosts the custom control) with the popup open, the popup stays in place (and doesn't follow the window)! It's kinda funny but obviously not acceptable behaviour. I've looked around but only found one post about this that went unanswered for two years :(
Actually, I didn't realize that I had StaysOpen property of the Popup set to true.
<Popup StaysOpen="False" />
actually does the trick for me.
I had the same problem in a similar scenario. What I did was I subscribed to all posible "lost focus" events of the control and also got the window which hosts the control and subscribed to its GotMouseCapture and LocationChanged events. Event handlers of all those events are setting the popup's IsOpen property to false.
You can get the hosting window with this:
parentWindow = Window.GetWindow(this);
all other code is simply a lot of subscribing to events to do the same thing.
P.S. I'm not saying it's a pretty or optimal solution, but it works fine for me :)
According to the Popup documentation:
When Popup is displayed on the screen, it does not reposition itself if its parent is repositioned.
So it does not look like it would be a very good candidate for an autocomplete textbox. I think the class is meant more for showing information when you hover over an item.