WPF/MVVM: Refactoring Code-Behind to make it ready for MVVM binding

Question

Hello,

I have this code in my code-behind file of my View:

private string GetSelectedSchoolclassCode()
    {
        return ((SchoolclassCode)cboSchooclassCodeList.SelectedItem).SchoolclassCodeName;
    }

    private void dgTimeTable_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
    {        
        var columnNumber = dgTimeTable.CurrentCell.Column.DisplayIndex;
        var timetable = dgTimeTable.CurrentItem as TimeTableViewModel;

        switch (columnNumber)
        {
            case 0: timetable.SchoolclassCodeMonday = GetItemValue(timetable.SchoolclassCodeMonday); break;
            case 1: timetable.SchoolclassCodeTuesday = GetItemValue(timetable.SchoolclassCodeTuesday); break;
            case 2: timetable.SchoolclassCodeWednesday = GetItemValue(timetable.SchoolclassCodeWednesday); break;
            case 3: timetable.SchoolclassCodeThursday = GetItemValue(timetable.SchoolclassCodeThursday); break;
            case 4: timetable.SchoolclassCodeFriday = GetItemValue(timetable.SchoolclassCodeFriday); break;
            case 5: timetable.SchoolclassCodeSaturday = GetItemValue(timetable.SchoolclassCodeSaturday); break;
            case 6: timetable.SchoolclassCodeSunday = GetItemValue(timetable.SchoolclassCodeSunday); break;
        }
    }

    private string GetItemValue(string schoolclassCodeWeekDay)
    {
        if (schoolclassCodeWeekDay == null)
            schoolclassCodeWeekDay = GetSelectedSchoolclassCode();
        else
            schoolclassCodeWeekDay = null;

        return schoolclassCodeWeekDay;
    }

I would like to put all this code in the ViewModel. The problem already starts with the CurrentColumn.DisplayIndex in XAML. I can not declare it with binding as the syntax is not allowed. WPF thinks that DisplayIndex is an attached property...

What would you do?

Answer 1

It can be tricking and quite complex to get pure XAML / ViewModel separation when dealing with complex controls such as a data grid. In some cases it might be best to have a little code behind to achieve cleaner XAML and code.

perhaps try

private void dgTimeTable_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{        
    var columnNumber = dgTimeTable.CurrentCell.Column.DisplayIndex;
    ((YourViewModel)DataContext).SetDisplayIndex(columnNumber);
}

and in your view model have the rest of the code

private string GetSelectedSchoolclassCode()
{
    return ((SchoolclassCode)SelectedSchooclass).SchoolclassCodeName;
}

public int SetDisplayIndex(int columnNmber)
{        
         var timetable = CurrentItem as TimeTableViewModel;

        switch (columnNumber)
        {
            case 0: timetable.SchoolclassCodeMonday = GetItemValue(timetable.SchoolclassCodeMonday); break;
            case 1: timetable.SchoolclassCodeTuesday = GetItemValue(timetable.SchoolclassCodeTuesday); break;
            case 2: timetable.SchoolclassCodeWednesday = GetItemValue(timetable.SchoolclassCodeWednesday); break;
            case 3: timetable.SchoolclassCodeThursday = GetItemValue(timetable.SchoolclassCodeThursday); break;
            case 4: timetable.SchoolclassCodeFriday = GetItemValue(timetable.SchoolclassCodeFriday); break;
            case 5: timetable.SchoolclassCodeSaturday = GetItemValue(timetable.SchoolclassCodeSaturday); break;
            case 6: timetable.SchoolclassCodeSunday = GetItemValue(timetable.SchoolclassCodeSunday); break;
        }
    }

private string GetItemValue(string schoolclassCodeWeekDay)
{
    if (schoolclassCodeWeekDay == null)
        schoolclassCodeWeekDay = GetSelectedSchoolclassCode();
    else
        schoolclassCodeWeekDay = null;

    return schoolclassCodeWeekDay;
}

Provided you include bindings for the combobox to SelectedSchooclass and the currentitem on the data grid to the view model