Using shouldBeDisabled to enable / disable controls - meteor

Is using shouldBeDisplay the way to enable / disable a control on the html or it is easier to go with jscript? I have the follow code (spacebar i believe) but it does not trigger anything.
template:
<template name="prodlist">
<select id="category-select">
<option {{ shouldBeDisabled }} selected="selected">Please Select</option>
{{#each prodlist}}
<option value="{{this}}">{{this}}</option>
{{/each}}
</select>
</template>
helper:
Template.registerHelper("shouldBeDisabled", function(prodlist) {
return "disabled"
});

Found the error - the disable should be placed at the select not option:
<template name="prodlist">
<select id="category-select" disabled= {{ shouldBeDisabled }}>
<option selected="selected">Please Select</option>
{{#each prodlist}}
<option value="{{this}}">{{this}}</option>
{{/each}}
</select>
</template>

Related

Is it possible to have checkbox in dropdown menu in wtform flask?

Please someone help me on having checkboxes in the dropdown list in wtforms flask and i need to select more than one check box and send data to form.Here is my code
#WTform
class ReporttestForm(FlaskForm):
pname = TextField("Platform Name",validators=[DataRequired()])
proname = TextField('Project Name', validators=[DataRequired()])
collab = SelectField ('Category', choices=[('1', '1'), ('2', '2'), (3', '3'),('4','4')])
submit = SubmitField('GENERATE')
#HTML code
<form method="POST" enctype=multipart/form-data action="">
{{ form.hidden_tag() }}
{{ form.csrf_token }}
<div>
{{ form.pname.label }}
{{ form.pname}}
{{ form.proname.label}}
{{ form.proname }} <br><br>
<select id="collab" multiple="multiple">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
{{ form.submit}}
</div>

How can I repeat a block N times in a Meteor Spacebars template?

I have this block of code in a Spacebars template:
1.
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
I would like to repeat this N times incrementing the number each time like so:
1.
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
2.
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
3.
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
I would love to be able to pass N to a custom template tag to take care of this (e.g. {{choices 3}}). What's a nice DRY way to do this? I have a vague notion I could write a template helper, but I'm not sure where to start.
Working Example:
http://meteorpad.com/pad/THAQfpfrru5MgAGnS/Copy%20of%20Leaderboard
You can pass a count in and return an array of arbitrary objects. Not the most elegant... but it worked!
HTML
<body>
{{>content}}
</body>
<template name="content">
{{#each loopCount 5}}
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
{{/each}}
</template>
JS
Template.content.helpers({
choices: function(){
return ['choice1','choice2','choice3']
},
loopCount: function(count){
var countArr = [];
for (var i=0; i<count; i++){
countArr.push({});
}
return countArr;
}
});
If you're using the underscore package for Meteor, and also happen to be using CoffeScript, you can create the following single-line template helper:
t.helpers
loop: (count) -> {} for i in _.range count
You can then use this helper in your template:
{{! Will display 'Output' 5 times }}
{{#each loop 5}}
Output
{{/each}}

Meteor Dropdown list get and set

What is the best way to get and select values from a dropdown list (and also in radio) in Meteor.
I have created a helper:
Template.categories.helpers({
categories: ["facebook", "news", "tv", "tweets"]
});
and in html
...
<select class="form-control" id="category">
{{> categories}}
</select>
...
<template name="categories">
<option disabled="disabled" selected="selected">Please Select</option>
{{#each categories}}
<option value="{{this}}">{{this}}</option>
{{/each}}
</template>
In case of edit, I would like to evaluate it with value coming from database (e.g. news) to be selected.
Thanks in advance.
Template HTML:
<select id="category-select">
<option disabled="disabled" selected="selected">Please Select</option>
{{#each categories}}
<option value="{{this}}">{{this}}</option>
{{/each}}
</select>
Template js:
Template.categories.helpers({
categories: function(){
return ["facebook", "news", "tv", "tweets"]
}
});
Template.categories.events({
"change #category-select": function (event, template) {
var category = $(event.currentTarget).val();
console.log("category : " + category);
// additional code to do what you want with the category
}
});
Template.categories.helpers({
categories: function(){
return ["facebook", "news", "tv", "tweets"]
}
});
And you should consider changing template name and helper, they shouldn't be the same.

Meteor ignoring 'selected' attribute on <option> on <select multi>

I am trying to use a multi select box in meteor and have some of the options be marked with selected based on info from the db for use with slectize.js. however it seems like meteor when building its DOM tree ignores the selected property.
<label>User</label>
<select id="customer_user_id" name="user_id" class="form-control input-sm" multiple>
{{#each users}}
{{#if inList _id ../customer_user_id}}
<option value="{{_id}}" selected>{{full_name}}</option>
{{else}}
<option value="{{_id}}">{{full_name}}</option>
{{/if}}
{{/each}}
</select>
and the helper
Handlebars.registerHelper("inList", function (val, list) {
console.log(list.indexOf(val) > -1)
console.log(list)
console.log(val)
return list.indexOf(val) > -1;
});
i see that the condition is true but there is no options with the selected property
I have been breaking my head on this for more then 24 hours now
I have also tried this method with the same result
<label>User</label>
<select id="customer_user_id" name="user_id" class="form-control input-sm" multiple>
{{#each users}}
<option value="{{_id}}" {{selected _id ../customer_user_id "selected"}}>{{full_name}}</option>
{{/each}}
</select>
with this helper
Handlebars.registerHelper("selected", function (val1, val2, string) {
if (val1 === val2) {
return string;
}
});
Try using selected="selected" instead of just selected:
<option value="{{_id}}" selected="selected">{{full_name}}</option>

Meteor each loop data not displaying

In each loop data is not displaying.value="{{param_type}}" not displaying.Please help me.
{{ #each api_method_param_data }}
<select id="param_type">
{{#each dropdown}}
{{#if isSelected this param_type}}
<option value="{{param_type}}" selected="selected"> {{this}} </option>
{{else}}
<option value="{{param_type}}" > {{this}} </option>
{{/if}}
{{/each}}
</select>
{{/each}}
This is the helper function
Template.apimethodchange.isSelected = function(fooToCheck, recordFoo)
{
var checkrec = "";
for(var i=0;i<recordFoo.length;i++)
{
checkrec = checkrec + recordFoo[i];
}
console.log(checkrec + fooToCheck);
return (fooToCheck == checkrec);
};
Template.apimethodchange.dropdown = ["string","array","int","boolean","double","struct"];
Try with ../ to access parent context
<option value="{{../param_type}}" selected="selected"> {{this}} </option>

Resources