StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>I took the <code>{{#each}}</code> helper as inspiration, and wrote a custom helper that does the same thing: loops over a list, and continually appends the contents of the arguments to an output string. (From here: <a href="http://handlebarsjs.com/block_helpers.html" rel="nofollow noreferrer">Handlebars block helpers</a>)</p> <p>In this case, I'm not passing in a chunk of template HTML to serve as the function's <code>options</code> parameter, like you would when using <code>{{#each}}</code>. Instead I am just building up the <code><option></code> tags by brute force, and testing every iteration of the <code>context</code> list. Lastly, I return a big long string of <code><option></option></code> tags, and hopefully one of them has <code>selected="selected"</code>.</p> <p>The function:</p> <pre><code>Handlebars.registerHelper('options_selected', function(context, test) { var ret = ''; for (var i = 0, len = context.length; i < len; i++) { var option = '<option value="' + context[i]+'"'; if (test.toLowerCase() == context[i].toLowerCase()) { option += ' selected="selected"'; } option += '>'+ Handlebars.Utils.escapeExpression(context[i]) + '</option>'; ret += option; } return new Handlebars.SafeString(ret); }); </code></pre> <p>The tag in use:</p> <pre><code><script id="form-state" type="text/x-handlebars-template"> <select name="state"> {{{options_selected states selectedState}}} </select> </script> </code></pre> <p>Please suggest any edits that would improve this, thanks!</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload