title: How to bind a fresh object to the view with Rivets JS?
body: <p>I am working on the profile section of an application where the user can see the details of his profile on one side and if he clicks edit, a section on the right becomes visible which let's him edit the details.</p>
  
  <p>I am using RivetsJS to make it a single page application and therefore when a user starts to type in the textbox on the right hand side, the results also show up in the profile section on the left hand side basically because of the two way data binding which looks good and on update it stays that way.</p>
  
  <pre><code>var view = null;
  
  bindView = function(user){
      // If the view is binded previously, unbind it
      if(view != null){
          view.unbind();
      }
  
      // Bind a fresh object to the view
      view = rivets.bind($('#profile'), {user: user});
  
  };
  
  // Fetching the user details and binding them to the view
  $.getJSON('/auth/user', function(response){
      bindView(response);
  });
  </code></pre>
  
  <p>So when the view loads I have <code>view</code> variable which is null but then a JSON fetch from the server calls the <code>bindView()</code> method and passes the user object which is returned from the server and binds it to the view.</p>
  
  <pre><code>$.ajax({
      url: '/profile/update',
      type: 'POST',
      dataType: 'JSON',
      data: $('form#user-form').serialize(),
      success: function(response){
          bindView(response);
          $( "#toggleprofile" ).toggle("slow");
      },
  });
  </code></pre>
  
  <p>Now when the profile is updated, I again call the <code>bindView()</code> method which first unbinds the view and then binds it with a fresh object (see mehtod). The problem is that it not binding it and the page breaks. If I remove the <code>view.unbind()</code> from the method, it works fine.</p>
  
  <p>So what is the right way and how does this work? I mean I thought I should unbind the view and then bind it with the new objects to their respective elements but that doesn't work. Why?</p>
  
  <p>And if I already binded the <code>#profile</code> tag to the <code>user</code> object and then I later bind it with another updated object, wouldn't there be clashes or is this the okay way to do it?</p>