WPF MVVM textBox Text Binding

Question

I am just getting started with MVVM so apologies if I've done something really stupid. I tried writing a very simple test to see if I could remember everything, and for the life of me I can't see why its not working.

In my view I have a textBox where its text property is bound to a value in the ViewModel. Then when pressing a button the value should be altered and the textBox update.

I can see the value does alter (I have added a MessageBox.Show() line in the buttom press command) however the textBox does not update.

I assume that this means I have not properly implemented the INotifyPropertyChanged event properly but am unable to see my mistake.

Could anyone point me in the right direction?

Here is the code:

View

<Window x:Class="Mvvm.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">

<StackPanel Orientation="Horizontal" VerticalAlignment="Top">
    <TextBox Height="40" Width="200" Text="{Binding helloWorld.Message, UpdateSourceTrigger=PropertyChanged}"/>
    <Button Command="{Binding UpdateTimeCommand}">Update</Button>
</StackPanel>
</Window>

Behind View

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = new ViewModel.MainWindowViewModel();
    }
}

ViewModel

namespace Mvvm.ViewModel
{
internal class MainWindowViewModel
{
    private HelloWorld _helloWorld;

    /// <summary>
    /// Creates a new instance of the ViewModel Class
    /// </summary>
    public MainWindowViewModel()
    {
        _helloWorld = new HelloWorld("The time is " + DateTime.Now.ToString("HH:mm:ss"));
        UpdateTimeCommand = new Commands.UpdateTimeCommand(this);
    }

    /// <summary>
    /// Gets the HellowWorld instance
    /// </summary>
    public HelloWorld helloWorld
    {
        get
        {
            return _helloWorld;
        }
        set
        {
            _helloWorld = value;
        }
    }

    /// <summary>
    /// Updates the time shown in the helloWorld 
    /// </summary>
    public void UpdateTime()
    {
        helloWorld = new HelloWorld("The time is " + DateTime.Now.ToString("HH:mm:ss"));
    }

    public ICommand UpdateTimeCommand
    {
        get;
        private set;
    }
}

Model

namespace Mvvm.Model
{
    class HelloWorld : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        public HelloWorld(string helloWorldMessage)
        {
            Message = "Hello World! " + helloWorldMessage;
        }

        private string _Message;
        public string Message
        {
            get
            {
                return _Message;
            }
            set
            {
                _Message = value;
                OnPropertyChanged("Message");
            }
        }

        private void OnPropertyChanged(string p)
        {
            PropertyChangedEventHandler handler = PropertyChanged;

            if (handler != null)
            {
                handler(this, new PropertyChangedEventArgs(p));
            }
        }
    }
}

Commands

namespace Mvvm.Commands
{
    internal class UpdateTimeCommand : ICommand
    {
        private ViewModel.MainWindowViewModel _viewModel;
        public UpdateTimeCommand(ViewModel.MainWindowViewModel viewModel)
        {
            _viewModel = viewModel;
        }

        public event EventHandler CanExecuteChanged
        {
            add { CommandManager.RequerySuggested += value; }
            remove { CommandManager.RequerySuggested -= value; }
        }

        public bool CanExecute(object parameter)
        {
            return true;
        }

        public void Execute(object parameter)
        {
            _viewModel.UpdateTime();
        }
    }
}

Sorry for such a long post and it being a spot my mistake post but I've looked at it for so long and I don't know what I'm doing wrong

Thanks!

I suppose that you also need to have a property change notification on the helloWorld property, because you are using the binding path helloWorld.Message. — user128300
– user128300, Commented Dec 6, 2012 at 14:46

Agustin Meriles · Accepted Answer · 2012-12-06 14:47:50Z

6

The Problem that you have is that you are changing the wrong Property. Instead of changing the HelloWorld.Message Property, you are changing MainWindowViewModel.HelloWorld property. Your code will work OK if you change this line:

public void UpdateTime()
{
    helloWorld = new HelloWorld("The time is " + DateTime.Now.ToString("HH:mm:ss"));
}

For this one

public void UpdateTime()
{
    helloWorld.Message = "The time is " + DateTime.Now.ToString("HH:mm:ss");
}

If you want to keep your original code, then you need to implement INotifyPropertyChanged for your ViewModel, and rise the event when you change helloWorld object.

Hope this helps

answered Dec 6, 2012 at 14:47

Agustin Meriles

4,8603 gold badges32 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Nick Williams Over a year ago

Yeah that works now. That should have been pretty obvious really. Not sure VMMV is all it's cracked up to be :P. Is it acceptable to implement a property change in the ViewModel?

Ucodia Over a year ago

@PetePetersen the view-model is actually where INotifyPropertyChanged has to be implemented in the first place! Remember that the view-model is the class to which you will bind the UI and this during the binding process that the UI is able to suscribe to the events of your view-model.

blindmeis Over a year ago

more then in a model ;) you should always implement INotifyPropertyChanged in the classes you are bind to, otherwise it can result in memoryleaks. code.logos.com/blog/2008/10/…

Agustin Meriles Over a year ago

Yes!, it's totally accepted to have INotifyPropertyChanged in the ViewModel. Go for it

CodeWarrior Over a year ago

Keep in mind that many frameworks that are used for models (Entity Framework comes to mind) expose their model classes with INotifyPropertyChanged by default. This lets you expose the data, but the ViewModel exposes properties that the View needs for how to present that data. If it doesn't get notifications that something has changed, then you will have static views that don't take advantage of many of the most powerful features of WPF.

CodeWarrior · Accepted Answer · 2012-12-06 15:18:24Z

2

I think you need to implement PropertyChanged notification on your ViewModel. You are creating a new HelloWorld in the UpdateTime method, but the UI doesn't know it.

Edit

I have a ViewModel base class which I derive all of my ViewModels from. It implements INotifyPropertyChanged, and has references to my relay command classes, and some other common stuff. I recommend always having INotifyPropertyChanged implemented on the ViewModel. The ViewModel is there to expose data to the UI, and it cant do that for data that changes without that interface.

edited Dec 6, 2012 at 15:18

answered Dec 6, 2012 at 14:49

CodeWarrior

7,4787 gold badges54 silver badges80 bronze badges

2 Comments

Ucodia Over a year ago

This implementation would definitely be better with change notification implemented on the VM even if the model already implements it.

CodeWarrior Over a year ago

Indeed. The idea behind having a ViewModel is to have a class that serves data to the View in such a way that the view can better use it. Even if the displayed data like text (in this case HelloWorld.Message) is not directly served by the ViewModel, eventually it is likely that other properties will be exposed there, brushes, visible states, etc.

user1064519 · Accepted Answer · 2012-12-06 14:54:20Z

1

i think your ViewModel needs to implement INotifyPropertyChanged too, or you can set the DataContext before you call InitializeComponents(), if you do that you should change your code to NOT create a new instance every update like Agustin Meriles said.

answered Dec 6, 2012 at 14:54

user1064519

2,19012 silver badges13 bronze badges

Comments

Community · Accepted Answer · 2020-06-20 09:12:55Z

i think you mistake Model and VM: Model is MainWindowViewModel and VM is HelloWorld

In your VM (class HelloWorld ) you need use your model

So, your classes will look like:

    using System.ComponentModel;

namespace WpfApplication1
{
    public sealed class TextVM : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;
        private TextInfo _info;

        public TextVM()
        {
            _info = new TextInfo();
        }

        public string MyText 
        {
            get { return _info.MyText; }
            set
            {
                _info.MyText = value;
                OnPropertyChanged("MyText");
            }
        }

        private void OnPropertyChanged(string p)
        {
            PropertyChangedEventHandler handler = PropertyChanged;

            if (handler != null)
            {
                handler(this, new PropertyChangedEventArgs(p));
            }
        }
    }
}


using System;

namespace WpfApplication1
{
    public sealed class TextInfo
    {
        public TextInfo()
        {
            MyText = String.Empty;
        }

        public string MyText { get; set; }
    }
}

inset inside your ICommands

Collectives™ on Stack Overflow

WPF MVVM textBox Text Binding

4 Answers 4

5 Comments

Edit

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

5 Comments

Edit

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related