Sea guy
Sea guy

Reputation: 178

Template Rendering in EmberJs

I'd like to know the event or others when any template is rendered.

<script type="text/x-handlebars" id="dashboard">
    <span>username</span><input type="text" id="username" />
    <span>email addr</span><input type="text" id="email" />
</script>

App.Router.map(function() {
    this.resource('index', { path: '/' }, function() {});
    this.resource('dashboard', {path: '/dashboard'}, function() {});
});

App.DashboardController = Ember.ObjectController.extend({})

App.DashboardRoute = Ember.Route.extend({
  renderTemplate: function() {
    this.render('dashboard', {   // the template to render
      controller: 'dashboard'        // the controller to use for the template
    }); 
  }
});

sample.js

function clearObj(){
  $("#username").val("");
  $("#email").val("");
}

I am going to run clearObj() function when the dashboard template is rendered. Which event or function do I have to use?

I can go to the dashboard template by typing on addressbar /#/dashboard or clicking some button etc.

Upvotes: 0

Views: 98

Answers (1)

intuitivepixel
intuitivepixel

Reputation: 23322

Wight might help is the afterRender hook of a view. When this hook runs you can be sure that everything has been rendered into the DOM.

For example subscribe to the hook in the didInsertElement and schedule the call to afterRender:

App.DashboardView = Ember.View.extend({
  didInsertElement: function() {
    Ember.run.scheduleOnce('afterRender', this, 'processChildElements');
  },

  processChildElements: function() {
    $("#username").val("");
    $("#email").val("");
  }
});

Hope it helps.

Upvotes: 1

Related Questions