Search code examples
jsrenderjsviews

Why can't TR be a direct child of TABLE in JsViews?

I've created a complex template using JsRender with a bunch of nested tables. Now I'm transitioning to using JsViews so that I can take advantage of data-binding+incremental DOM updates (so that I don't have to re-render the entire template). However, I get an interesting error:

screen-shot-of-error

This problem goes away if I make sure each tr is within any of thead, tbody, or tfoot, as long as the tr is not a direct child of table. So my question is this: where did this design decision for JsViews come from? Why impose this constraint?

Thanks in advance.

jsviews.js:83 badParent = {tr: "table"}
Solution

  • Yes, as JcFx says above in a comment, this is answered here.

    As I say there, JsViews works with the DOM element hierarchy. There are a few ways in which browsers may dynamically change the DOM to be in a canonical form, such has inserting a TBODY even if you didn't put one there in your markup.

    Rather than adding a lot of code, perf hit, and potential error risk by having JsViews try to automatically compensate for this, JsViews instead gives you an error message in most cases where it detects that your markup is not well-formed, or does not respect these 'canonical rules' - i.e. missing out a TBODY...