#if help and syntax question

help
1

I’m having trouble with autoform, seems to be what people are talking about here So I’m looking for another way to conditionally show and hide certain elements/fields on a form.

The autoform way is like this:

{{#if afFieldValueIs name="demographics.favoriteColor" value="Red"}}
{{> afQuickField name='demographics.whyRed'}}
{{/if}}

Here I will display a field that asks why they like red so much if they answer “Red” to the question on favorite color.

The problem is that autoform is having trouble reversing this, ie, if it shows it when the value is Red, it should also hide it when the value is not Red.

Can I do the same thing without autoform by just doing something like this?

    {{#if "demographics.favoriteColor" == "Red"}}
         <input type="text" id="whyRed" name="whyRed" placeholder="Why Red" value='{{demographics.whyRed}}'/> 
    {{/if}}
2

I sort of found a solution, but it’s not reactive… I created a helper:

Template.chart.helpers({
  testEqualityHelper: function(a, b) {
  return a == b; 
}
});

and use it like:

{{#if testEqualityHelper demographics.favoriteColor 'Red'}}
 red is your fav
{{else}}
red is not your fav
{{/if}}

But this only works for the initial load of the form, if I change the value in the form it doesn’t react and show or hide the “red is your fav” or “red is not your fav” message.

How do I get reactivity so that certain interactions by the user on the form will result in different things showing and hiding in the form.

It’s a simple use case, I see it all the time on web forms, where the user selects a certain country for example, then depending on the country selected, it might ask you what state or province you are in.

3

I did not used autoform, so without knowledge of that I can still monitor something like onSelect or what kind of event you do to pick the country and in event helper set reactive var.

And in your test just get that reactive var and return based on that.

And ofc initialise reactive var in start template hooks.

4

Hi,
You can try : http://docs.meteor.com/#/full/template_dynamic