2

Can I do nested templated with more than one hierarchy in for example kockoutjs library? http://knockoutjs.com/ or any other Javascript framework?

I have this View:

DataGrid:
Cell1, Cell2, Cell3, Within Cell4 is a ListBox.

Whatever it looks like in html. Is it possible with knockoutjs or any other javascript framework to create nested templates with multiple hierarchies?

Suresh Kamrushi
  • 15,627
  • 13
  • 75
  • 90
msfanboy
  • 5,273
  • 13
  • 69
  • 120

1 Answers1

0

Yes, it is possible in Knockout.

You can specify a template name inside a root element:

<ul data-bind="template: {name: listItemTmpl, foreach: items()}"></ul>

and then inside that template you can also reference other templates via data-bind attribute:

<script id="listItemTmpl" type="text/x-jquery-tmpl">
    <li>
        <h3 data-bind="text: name"></h3>
        <div data-bind="template: itemDetailsTmpl"></div>
    </li>
</script>

Knockout will apply root template binding and as it encounters data-bind attributes inside that template it applies those recursively.

Im my sample it will apply listItemTmpl for each of items() and then for each of those it will use itemDetailsTmpl to show the details.

Performance-wise it's very fast and unnoticable for the user.

I use knockout templates in this manner in my current project and recursive templating lets me keep parts of my markup orginized in small sections.

Is this something that you were looking for?

Andrei Андрей Листочкин
  • 8,442
  • 6
  • 43
  • 53
  • cool that you have answered. One more question I have about the power of that template coming from wpf background... When I have this ListBox within Cell4 , can I also put 3 buttons like add,del,open under the ListBox so that the ListBox and the 3 buttons are within that Cell4 ? The 3 buttons are for operations on the ListBox items :) – msfanboy Jun 30 '11 at 19:54
  • Yes, you can. Templates are just bits of HTML. HTML is hierarchical in a sence that nothing stops you from nesting elements within other elements. – Andrei Андрей Листочкин Jul 01 '11 at 09:20
  • 1
    Ok so concerning templates knockoutjs nearly that powerfull like silverlight but much more browser support. A reason to jump silverlight and choose asp.net mvc with jquery+knockoutjs. – msfanboy Jul 01 '11 at 10:48