My selectionchanged event is not updating the view, What am I missing?

Question

All fields are marked as TwoWay on databinding, but its obvious I have something wrong. What I have is a page showing a view to add new Devices on one side of the view, and a list of Devices on the other side.. What I'm trying to do is when selecting an item from listview, it will update values within the TextBox for viewing and editing purposes.

The Save option (not shown in Code Below) currently works when I create a new Device, and will refresh the list. however, right now I'm Going back a Frame when complete. What I would like to do is refresh ListView when I click save.

Values from XAML page

<TextBox PlaceholderText="Host Name" Text="{x:Bind ViewModel.HostName, Mode=TwoWay}" Name="hostNameTB" AcceptsReturn="True" />
<TextBox PlaceholderText="Drive Model" Text="{x:Bind ViewModel.DriveModel, Mode=TwoWay}" Name="driveModelTB" />
<TextBox PlaceholderText="Drive SN" Text="{x:Bind ViewModel.DriveSN, Mode=TwoWay}" Name="driveSNTB" AcceptsReturn="True" InputScope="Digits"/>

Code from ViewModel

    private Device _ActiveDevice;
    private int _HostName;
    //All Variables Created for DataBinding to XAML page

    //public int HostName { get { return _HostName; } set { _ActiveDevice.HostName = value; } }
    public int HostName { get; set; }
    public string DriveModel { get; set; }
    public string DriveSN { get; set; }

        public override async Task OnNavigatedToAsync(object parameter, NavigationMode mode, IDictionary<string, object> suspensionState)
    {

        Value = (suspensionState.ContainsKey(nameof(Value))) ? suspensionState[nameof(Value)]?.ToString() : parameter?.ToString();
        await Task.CompletedTask;

        var uri = new Uri("http://localhost:2463/api/Devices");
        HttpClient client = new HttpClient();

        try
        {
            var JsonResponse = await client.GetStringAsync(uri);
            var devicesResult = JsonConvert.DeserializeObject<List<Device>>(JsonResponse);
            Devices = devicesResult;

            _ActiveDevice = JsonConvert.DeserializeObject<List<Device>>(JsonResponse)[0];
        }
        catch
        {
            MessageDialog dialog = new MessageDialog("Unable to Access WebService at this Time!");
            await dialog.ShowAsync();
        }

        //client.Dispose();
    }    

    public void deviceList_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {

        var device = ((sender as ListView).SelectedItem as Device);
        _ActiveDevice = device;

        HostName = device.HostName;
        DriveModel = device.DriveModel;
        DriveSN = device.DriveSN;
    }

How do you notify the view that the properties have been updated? — Sir Rufo, Apr 26 '17 at 15:40

score 0 · Answer 1 · answered Apr 26 '17 at 15:40

You have to inherit the view model from INotifyPropertyChanged to let the binding know there was an update of the value.

public class MainViewModel: INotifyPropertyChanged
{

    public int HostName { get => hostName; set { hostName = value; OnPropertyChanged("HostName"); } }
    private int hostName;

    ...

    void OnPropertyChanged(String prop)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(prop));
    }
    public event PropertyChangedEventHandler PropertyChanged;

}

Update your binding (and all the others) to this:

<TextBox PlaceholderText="Host Name" Text="{Binding ViewModel.HostName, UpdateSourceTrigger=PropertyChanged}" Name="hostNameTB" AcceptsReturn="True" />

I forgot to also mention, that I am building this with a Template 10 template. I believe a lot of the INotifyPropertyChanged events are built into the Bootstrapper associated with the template. At least that was my understanding as a Newbie Dev. https://github.com/Windows-XAML/Template10/wiki — ekgcorp, Apr 26 '17 at 18:36

ekgcorp · Answer 2 · 2017-04-27T03:36:01.003

I was way off.. my fix was more of what Sir Rufo proposed.. The XAML was correct, but I needed to set the Get and Set of the property to update the property, and then to make sure selected device was update each property.

private int _HostName;
public int HostName { get { return _HostName; } set { Set(ref _HostName, value); } }
public void deviceList_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {

        var device = ((sender as ListView).SelectedItem as Device);
        //_ActiveDevice = device;

        HostName = device.HostName;
        DriveModel = device.DriveModel;
        DriveSN = device.DriveSN;

My selectionchanged event is not updating the view, What am I missing?

2 Answers2