Views not using application template
Testing the event flow between views and controller
HTML
<script src="https://raw.github.com/wycats/handlebars.js/1.0.rc.2/dist/handlebars.js"></script>
<script src="https://raw.github.com/emberjs/ember.js/release-builds/ember-1.0.0-pre.4.js"></script>
<body>
<div id='dvViewRender'>
</div>
<!--Define Handlebars template with name 'Parent' -->
<script type="text/x-handlebars" data-template-name="parent">
<fieldset>
<legend>Parent View </legend>
<input type="button" value="Parent View Click" {{action parentViewClick target="view"}} />
<input type="button" value="Parent Controller Click" {{action parentControllerClick }} />
{{render 'child'}}
</fieldset>
</script>
<script type="text/x-handlebars" data-template-name="child">
<fieldset>
<legend>Child View </legend>
<input type="button" value="Child View Click" {{action childViewClick target="view"}} />
<input type="button" value="Child Controller Click" {{action childControllerClick }} />
</fieldset>
</script>
</body>
JavaScript
var App = Ember.Application.create();
window.App = Ember.Application.create()
App.FirstLevelView = Ember.View.create
tagName: 'div'
classNames: ['box']
name: 'first level container'
template: Ember.Handlebars.compile '{{name}} {{view secondView}}'
secondView: Ember.View.extend
tagName: 'div'
classNames: ['box']
name: 'second level container should go inside first level container'
template: Ember.Handlebars.compile 'KS'
App.ParentController = Ember.Controller.extend({
parentControllerClick: function () {
alert('ParentControllerClick handled!');
}
});
var view = App.ParentView.create({ controller: App.ParentController.create() });
view.appendTo('#dvViewRender');