0
votes

I wanted to make a site where you choose university from the list, then list of majors from that university shows next to it, and then after choosing major, list of subjects next to those two shows up. However I don't know why after choosing a major, URL changes but majors list disappears (as well as the subjects list). My code is here: http://jsbin.com/IPadIsu/1/edit. Because the url is correct, after refreshing the page, everything renders correctly. What's strange for me: I get no errors from Ember debugger or console.

EDIT: Please choose always the top options from the list of universities, because no subjects' lists are defined for other universities.

1

1 Answers

2
votes

I understand Ember has a bit of a learning curve, let me give you a couple of hints.

 App.ApplicationRoute = Ember.Route.extend({
   renderTemplate: function() {
    // Render default outlet   
    this.render();
    // render extra outlets
    this.render("navbar", {
        outlet: "navbar",
        into: "application"
    });
   }
 });

 <script type="text/x-handlebars">
<!-- Navigation menu top bar -->
{{outlet "navbar"}}
{{outlet}}
 </script>

You're manually doing all of the rendering and setting up the rendering. This adds a large level of complexity to Ember. Especially because if you render into an outlet you will destroy any outlets that also live in that named outlet.

On your application route you can completely remove the renderTemplate method and just use a partial in the application template (especially since you didn't even specify a different controller to use when rendering into the navbar template, and they are using the same controller).

 App.ApplicationRoute = Ember.Route.extend();

 <script type="text/x-handlebars">
<!-- Navigation menu top bar -->
{{partial "navbar"}}
{{outlet}}
 </script>

There were a slew of other manual rendering actions that can be tossed. I've updated your example:

http://jsbin.com/IPadIsu/17/edit