5

I've been playing around with a few js templating engines. They all seem to offer fairly standard features and make generating html with JS much simpler.

I have yet to discover an engine though that offers data bindings on elements. I'd like to be able to do something like:

  1. render template with data to a particular div
  2. update all attributes from that template with new data (not by overwriting all the html)

I'd like this mainly so I don't have to keep adding events etc to the generated html. I have an app that is polling every 2 secs for new data and doing an innerHTML style update will make it very annoying as I have to repeatedly update the dom events associated with that html.

Has anyone seen this type of js template engine around?

brad
  • 30,001
  • 27
  • 98
  • 151
  • Unfortunately, no. But +1 for the idea. – Ryan Kinal Jul 09 '10 at 19:36
  • 1
    > *so I don't have to keep adding events etc to the generated html* Are you familiar with event delegation? That is, adding the event listeners once to the container div, instead of each child, and have event propagation take care of the rest? – Crescent Fresh Jul 10 '10 at 03:07
  • i don't understand. if for instance I have 5 different controls (ie links) that do 5 different things and I replace that html, I still have to individually add those 5 events again. – brad Jul 12 '10 at 02:31
  • ah I see... thx for the heads up! I have a feeling my event coding is about to change. – brad Jul 12 '10 at 13:30
  • @Crescent Fresh: Can you add some reference links to what you mean by 'event delegation'? Sounds interesting. – John Jul 13 '10 at 22:26
  • 1
    @John: sure! See this previous answer I gave with lots of juicy links: http://stackoverflow.com/questions/1687296/what-is-dom-event-delegation/1688293#1688293 Note there is nothing in there about JavaScript template engines. – Crescent Fresh Jul 14 '10 at 11:43

1 Answers1

1

There was an earlier question “What good template language is supported in Javascript?”, in which @balupton mentions a Smarty implementation in JavaScript that can apparently do this.

Community
  • 1
  • 1
Stéphan Kochen
  • 18,522
  • 9
  • 55
  • 48
  • haven't verified this to be true yet, but a quick glance at the site and I didn't see anything about this type of functionality – brad Aug 10 '10 at 14:20
  • You want to scroll all the way down on the demo page, and look at the “auto_update” section. – Stéphan Kochen Aug 10 '10 at 19:53