CODEWITHSUNDEEP
c#wpfmvvm
Madurika Welivita
Madurika Welivita

Reputation: 900

WPF MVVM Prevent tab change

I am having a WPF Tab control with two tabs called "OFFLINE" & "ONLINE". When "ONLINE" tab click, I need to chek whether application is in online status or not.If (status ! = online) display error message and prevent displaying "ONLINE" (2nd) tab and go to "OFFLINE" tab.

VIEW.XAML

 <TabControl Name="dashboardTabControl" SelectedIndex="{Binding SelectedTabIndex,Mode=TwoWay}">
        <TabItem Header="Local Dashboard">
            <views:OfflineDashboard DataContext="{Binding OfflineDashboardViewModel}"/>
        </TabItem>
        <TabItem Header="Online Dashboard">
            <views:OnlineDashboard DataContext="{Binding OnlineDashboardViewModel}"/>
        </TabItem>
    </TabControl>

VIEWMODEL

       public int SelectedTabIndex
        {
            get
            {
                return this.selectedTabIndex;
            }

            set
            {
                if (value == 1 && !applicationData.IsApplicationOnline())
                {
                    this.SelectedTabIndex = 0;
                }
                else
                {
                    this.selectedTabIndex = value;
                }

                // TODO : According to the selected tab index , populate ONLINE/OFFLINE 
viewmodels

NotifyPropertyChange("SelectedTabIndex");
            }
        }

Question : Although i checked status and set tab to 0, it doesn't work. always onclick of 2nd tab it will displayed ONLINE tab.

Upvotes: 4

Views: 4050

Answers (3)

Madurika Welivita
Madurika Welivita

Reputation: 900

Finally I found a solution for my problem:

XAML

<TabControl Name="dashboardTabControl"  Margin="0,5,0,0" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                <TabItem Header="Local Dashboard" IsSelected="{Binding IsOnline,Converter={StaticResource invertBoolConverter}}" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Top">
                    <views:OfflineDashboard DataContext="{Binding OfflineDashboardViewModel}"/>
                </TabItem>
                <TabItem Header="Online Dashboard" IsSelected="{Binding IsOnline}" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Top">
                    <views:OnlineDashboard DataContext="{Binding OnlineDashboardViewModel}"/>
                </TabItem>

Now I am using IsSelected property of TabItem, instead of SelectedIndex

VIEWMODEL

public bool IsOnline
        {
            get
            {
                return isOnline;
            }
            set
            {
                // When ONLINE tab click, check whether application is online,
                // if not, do not display ONLINE tab
                if (value && !applicationData.IsApplicationOnline())
                {
                    isOnline = false;
                    return;
                }
                else
                {
                    isOnline = value;
                }

                LoadTabContent();

                NotifyPropertyChange("IsOnline");
            }
        }

This solved my problem.

Upvotes: 2

Emond
Emond

Reputation: 50672

I would do this the other way around.

Have the ViewModel listen for network changes and expose a bool property Online.

Bind the Enabled property of the Tabpages to this bool.

That way you do not pollute the ViewModel with UI code.

Upvotes: 2

Haris Hasan
Haris Hasan

Reputation: 30097

You should implement INotifyPropertyChanged in your ViewModel. After changing the SelectedTabIndex notify View that selected index of tab control has been changed via PropertyChanged event of INotifyPropertyChanged.

And in your XAML do

SelectedIndex="{Binding SelectedTabIndex,Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}

Upvotes: 0

Related Questions