Generate dynamic Ajax controls from intuitive declarative templates.

Design your own template.

Add your control script.

Add your JBST control script and the JBST support script to your webpage.

				<script type="text/javascript" src="/scripts/jbst.js"></script>
				<script type="text/javascript" src="/scripts/Foo.MyZebraList.js"></script>

Bind your data.

Binding to a JBST control is as easy as it gets. Here's an example of binding Foo.MyZebraList to data:

				function showExample() {
					// get some data
					var myData = 
						{
							title: "Hello world",
							description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam lacinia consequat diam, ac auctor eros suscipit et. Donec rhoncus bibendum scelerisque.",
							timestamp: new Date(),
							children: [
								{ label: "The first item", selected: false },
								{ label: "Another child item", selected: false },
								{ label: "And again", selected: false },
								{ label: "Final item", selected: false }
							]
						};

					// randomly mark one as selected
					myData.children[Math.floor(Math.random() * myData.children.length)].selected = true;

					// bind the control to your data
					var myList = Foo.MyZebraList.bind(myData);

					// insert into the page
					document.body.appendChild(myList);
				}

Show example!