1

I have a project with a very standard layout so I suspect this is a common problem:

<body>
HEADER-CONTAINER DIV - includes superfish jQuery menu plugin but am open to other menu options if necessary.
CONTENT-CONTAINER DIV - depending on the page, contains several other jQuery plugins, HTML, javaScript, etc.
FOOTER-CONTAINER DIV
</body>

I'm looking for a elegant and well performing way to have a superfish menu click load the CONTENT-CONTAINER DIV with new content. The content contains both HTML and javaScript. I also want the solution to change the URL so if someone returns later to /my/page it will reload to the correct location (similar my understanding of Backbone.Router).

Any suggestions? If possible, please provide a link to a page loading into a div example and running any javaScript included in the load.

JStark
  • 2,788
  • 2
  • 29
  • 37

2 Answers2

0

Superfish or not this is not really a problem. Whenever you add html to the page the browser will execute any javascript or load any javascript file this new html snippet will contain.

So when you click on your menu, you load (or generate) new html and replace your content div with this new content, the browser will execute the scripts.

You will have to rebind all events on that newly inserted content because jQuery will loose track of that.

Julien
  • 9,216
  • 4
  • 37
  • 38
  • Thanks for the response. I've got a decent understand of the approach and am looking for an example that replaces the content div with the new content as you have described and also handles URL routing. – JStark Aug 22 '11 at 17:32
  • Read up the documentation on Routers in Backbone. As for replacing the content div $(".content").html("") is all there is. – Julien Aug 22 '11 at 19:49
0

I searched around and found the a decent example that shows how to take any #url and reload a div. Example found at http://thomasdavis.github.com/examples/restful-app/

JStark
  • 2,788
  • 2
  • 29
  • 37