Home/ Questions/Q 6104509
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-23T13:51:01+00:00

I am having a problem with dynamically loaded views not being able to attach

  • 0

I am having a problem with dynamically loaded views not being able to attach to the this.el scope variable.

To illustrate what I am trying to achieve:

HTML PAGE

<html>
    <head> head stuff </head>
    <body>
          <div id="appWrap"></div>
    </body>
</html>

Now if I had a view called View.PageSetUp that will add a couple of set up divs to #appWrap I get:

HTML PAGE – View.AppSetUp

<html>
    <head> head stuff </head>
    <body>
          <div id="appWrap">
                <div id="nav">buttons…</div>
                <div id="side">side stuff…</div>
                <div id="content"></div>
          </div>
    </body>
</html>

My problems come when I want to add a specific view to the content stage because this.el will not see the dynamically loaded $('#content').

Trying to then reload the this.el in the initialize function turned out to be a BIG no no… it didn’t like it.

this.el = $('#content'); // rubbish idea!

It feels like dynamically loaded templates and views must be viable in a javascript application, so how would I make this work?

I guess one possibility is that when I am loading my scripts the el is set up then and there:

App.Views.Channel = Backbone.View.extend({
      ………………
})

Should I be using a loader to make this work? If so, any recommendations? I have experience with required but would it be too much for something so simple?

Thanks for your help!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I’ve worked out the solution to this, so I’ll leave it here incase anyone else has the same problem.

    Basically I was setting el in the view itself:

    App.Views.Channel = Backbone.View.extend({
  el : $('#myID'),
  ………………
})

    Where I should have set it when I called a new instance of the view.

    newView = App.Views.Channel(model, { el: $("#search_container") });

    All seems to work anyway!

    • 0