Templating work
This commit is contained in:
parent
2b06448aef
commit
df9e311f2b
@ -25,80 +25,36 @@
|
|||||||
<th class="text-right">Rating</th>
|
<th class="text-right">Rating</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
|
<tbody id="categories">
|
||||||
|
<script id="template" type="text/x-handlers-template">
|
||||||
|
{{#each categories}}
|
||||||
<tr>
|
<tr>
|
||||||
<td class="text-left">Now is the time for all good men</td>
|
<td class="text-left">{{description}}</td>
|
||||||
<td class="text-right">
|
<td class="text-right">
|
||||||
<label class="radio-inline">
|
<label class="radio-inline">
|
||||||
<input type="radio" name="test1" value="-1"> Agree
|
<input type="radio" name="category_{{id}}" value="1" {{checkMatch 1}}> Agree
|
||||||
</label>
|
</label>
|
||||||
<label class="radio-inline">
|
<label class="radio-inline">
|
||||||
<input type="radio" name="test1" value="-1" checked> Neither
|
<input type="radio" name="category_{{id}}" value="0" {{checkMatch 0}}> Neither
|
||||||
</label>
|
</label>
|
||||||
<label class="radio-inline">
|
<label class="radio-inline">
|
||||||
<input type="radio" name="test1" value="-1"> Disagree
|
<input type="radio" name="category_{{id}}" value="-1" {{checkMatch -1}}> Disagree
|
||||||
</label>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td class="text-left">Now is the time for all good men</td>
|
|
||||||
<td class="text-right">
|
|
||||||
<label class="radio-inline">
|
|
||||||
<input type="radio" name="test2" value="-1"> Agree
|
|
||||||
</label>
|
|
||||||
<label class="radio-inline">
|
|
||||||
<input type="radio" name="test2" value="-1" checked> Neither
|
|
||||||
</label>
|
|
||||||
<label class="radio-inline">
|
|
||||||
<input type="radio" name="test2" value="-1"> Disagree
|
|
||||||
</label>
|
</label>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
{{/each}}
|
||||||
|
</script>
|
||||||
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
|
||||||
<!-- category adder -->
|
<!-- category adder -->
|
||||||
<div class="input-group">
|
<div class="input-group">
|
||||||
<input type="text" class="form-control" placeholder="New category text">
|
<input type="text" class="form-control" placeholder="New category description">
|
||||||
<span class="input-group-btn">
|
<span class="input-group-btn">
|
||||||
<button class="btn btn-primary"><span class="glyphicon glyphicon-plus"></span></button>
|
<button class="btn btn-primary"><span class="glyphicon glyphicon-plus"></span></button>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- result listing -->
|
|
||||||
<!-- <div class="panel panel-default" style="display: none;" id="resultPanel"> -->
|
|
||||||
<!-- <div class="panel-heading"> -->
|
|
||||||
<!-- <big>Results (<span id="resultCount"></span>)</big> -->
|
|
||||||
<!-- </div> -->
|
|
||||||
<!-- <div class="panel-body"> -->
|
|
||||||
<!-- <script id="template" type="text/x-handlers-template"> -->
|
|
||||||
<!-- {{#if results}} -->
|
|
||||||
<!-- <table class="table table-striped table-condensed"> -->
|
|
||||||
<!-- <thead> -->
|
|
||||||
<!-- <tr> -->
|
|
||||||
<!-- <th>Id</th> -->
|
|
||||||
<!-- <th>Name</th> -->
|
|
||||||
<!-- <th>Distance to user</th> -->
|
|
||||||
<!-- <th>Closest station</th> -->
|
|
||||||
<!-- <th>Distance to station</th> -->
|
|
||||||
<!-- <th>Score</th> -->
|
|
||||||
<!-- </tr> -->
|
|
||||||
<!-- </thead> -->
|
|
||||||
<!-- {{#each results}} -->
|
|
||||||
<!-- <tr> -->
|
|
||||||
<!-- <td>{{id}}</td> -->
|
|
||||||
<!-- <td><a href="{{url}}">{{name}}</a></td> -->
|
|
||||||
<!-- <th>{{distanceToUser}} km</th> -->
|
|
||||||
<!-- <th>{{closestStn}}</th> -->
|
|
||||||
<!-- <th>{{distanceToStn}} km</th> -->
|
|
||||||
<!-- <td>{{score}}</td> -->
|
|
||||||
<!-- </tr> -->
|
|
||||||
<!-- {{/each}} -->
|
|
||||||
<!-- </table> -->
|
|
||||||
<!-- {{/if}} -->
|
|
||||||
<!-- </script> -->
|
|
||||||
<!-- <div id="results"></div> -->
|
|
||||||
<!-- </div> -->
|
|
||||||
<!-- </div> -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<script src="bower_components/jquery/dist/jquery.js"></script>
|
<script src="bower_components/jquery/dist/jquery.js"></script>
|
||||||
<script src="bower_components/handlebars/handlebars.js"></script>
|
<script src="bower_components/handlebars/handlebars.js"></script>
|
||||||
|
@ -20,4 +20,34 @@
|
|||||||
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
(function(hscd) {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
function displayCategories(categories) {
|
||||||
|
var template = Handlebars.compile($('#template').html());
|
||||||
|
$('#categories').empty();
|
||||||
|
$('#categories').append(template({categories: categories}));
|
||||||
|
}
|
||||||
|
|
||||||
|
function onReady() {
|
||||||
|
Handlebars.registerHelper('checkMatch', function(value, options) {
|
||||||
|
return new Handlebars.SafeString(
|
||||||
|
value == this.value ? 'checked' : ''
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
var categories = [
|
||||||
|
{description: 'Description1', id: 0, value: -1},
|
||||||
|
{description: 'Description2', id: 1, value: 0},
|
||||||
|
{description: 'Description3', id: 2, value: 1},
|
||||||
|
];
|
||||||
|
|
||||||
|
displayCategories(categories);
|
||||||
|
}
|
||||||
|
|
||||||
|
$(document).on({
|
||||||
|
ajaxStart: function() { $('#spinner').show(); },
|
||||||
|
ajaxStop: function() { $('#spinner').hide(); },
|
||||||
|
ready: onReady()
|
||||||
|
});
|
||||||
|
})();
|
||||||
|
Loading…
Reference in New Issue
Block a user