How to render a view in EmberJS 1.13.8 without refreshing the page?

Sorry if this question is too naive,but I am getting confused a lot on rendering views in Ember.

I have a 'Person' route. I am able to do CRUD operations on it.

router.js

  this.route('person', function() {
    this.route('index', { path: '' });
 });

controllers/person/index.js

actions: {    
  createPerson: function() {
  var person = this.get('store').createRecord('person');
  this.set('person', person);
  this.set('editPersonPane', true);
},

editPerson: function(person) {
  this.set('person', person);
  this.set('editPersonPane', true);
},

closeEditPerson: function() {
 this.get('person').rollback();
 this.set('editPersonPane', false);
},

savePerson: function(person) {
  var _this = this;
  person.save().then(function() {
    _this.set('editPersonPane', false);
    Ember.get(_this, 'flashMessages').success('person.flash.personUpdateSuccessful');
  }, function() {
    Ember.get(_this, 'flashMessages').danger('apiFailure');
  });
},

deletePerson: function(person) {
  var _this = this;
  person.destroyRecord().then(function() {
    _this.set('editPersonPane', false);
    Ember.get(_this, 'flashMessages').success('person.flash.personDeleteSuccessful');
  }, function() {
    Ember.get(_this, 'flashMessages').danger('apiFailure');
  });
}
}

What I want to do now is when I want to create a new person, a form slides in to create it. After filling up the form, I want the list view of persons to be updated immediately, without refreshing the page. Right now, I have been able to add the form and when I add a new person, I get a successful flash message but it's not updated in the view immediately. I have to refresh the page.

It might have to do something with observers but I am still not sure how.