title: Show/Hide Login/Logout buttons based on the user state Knockout
body: <p>I Have a Login form (MVC and Knockout), I want to show or hide the Login and Logout button based on the user's state, if the user is login it should show the Logout button and vice versa.</p>
  
  <p>I have tried doing it with the <code>visible</code> attribute but it's not working properly, it always shows the Login button.</p>
  
  <p>I set in the code the Logout button the be visible after Login and the Login button to be visible after Logout.</p>
  
  <pre><code>&lt;form id="formLogin" data-bind="submit: login"&gt;
      &lt;label&gt;User ID&lt;/label&gt;
      &lt;input class="required email form-control" type="text" data-bind="value: loginUserName" name="loginUserName" /&gt;
  
      &lt;label&gt;Password&lt;/label&gt;
      &lt;input class="required form-control" type="password" data-bind="value: loginPassword" name="loginPassword" /&gt;
  
      &lt;button type="submit" class="btn-orange" id="buttonLogin" data-bind="visible: showLoginButton"&gt;Log In&lt;/button&gt; &lt;br /&gt;
      &lt;button data-bind="click: logout, visible: showLogoutButton" class="btn btn-default" id="buttonLogout"&gt;Log Out&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>My Login.js View Model:</p>
  
  <pre><code>var Login= function () {
  
  /////////////// variables ///////////////
  var self = this;
  ...
  self.showLoginButton = ko.observable(true);
  self.showLogoutButton = ko.observable(false);
  
  /////////////// functions ///////////////
  
  
  self.login = function (callback) {
      var loginData = {
          grant_type: 'password',
          username: self.loginUserName(),
          password: self.loginPassword()
      };
      $.ajax({
          type: 'POST',
          url: '../API/Token',
          data: loginData
      }).done(function (data) {
          sessionStorage.setItem(tokenKey, data.access_token);
          localStorage.setItem("userID", self.loginUserName());
          self.authenticate();
          self.showLogoutButton(true);
          self.showLoginButton(false);
          if (callback &amp;&amp; typeof callback == "function")
              callback();
  
          self.redirect('MyPage');
      }).fail(showError);
  }
  
  self.logout = function () {
      sessionStorage.removeItem(tokenKey)
      self.showLoginButton(true);
      self.showLogoutButton(false);
   }  
  }
  </code></pre>
  
  <p>Please advise.</p>