Search Concept #1

Possible Strategy for flexible search parameters

by pkpjpm

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://borismoore.github.com/jsrender/jsrender.js"></script>
<div class="alert">We're bootstrappin</div>
<ul>
    <li>
        <input id="tenantOptions" type="checkbox" value="Tenant Options" />Tenant Options</li>
</ul>
<table>
    <tr id="header" />
    <tr id="terms" />
</table>
<script id="headertemplate" type="text/x-jsrender">
    {{for provisions}}
    <th>{{:name}}</th>        
    {{/for}}
</script>
<script id="termtemplate" type="text/x-jsrender">
    {{for provisions}}
    <td><input type="text"/></td>        
    {{/for}}
</script>

JavaScript

var data = {
    provisions: [{
        name: 'foo'
    }, {
        name: 'bar'
    }, {
        name: 'baz'
    }]
};

$("#tenantOptions").click(function () {
    if (this.checked) {
        $("#header").html( $("#headertemplate").render(data) );
        $("#terms").html( $("#termtemplate").render(data) );
    }
});