CODEWITHSUNDEEP
javascriptmeteormeteor-autoform
Simo Mafuxwana
Simo Mafuxwana

Reputation: 3762

MeteorJS: Show/Hide leaving blank divs

I am doing a show/hide by changing field type of companyName based on customerType answer

enter image description here enter image description here

It works but instead of hiding the entire div, it seems to just make the opacity 0, leaving a blank spaces like so

enter image description here

When I inspect the elements it shows form group divs with no content

enter image description here

UPDATE: I am trying to keep the dependency logic on the schema. That way I can have 1 form html template and let the each form's schema handle it's show/hide logic. This approach will make it easy to maintain the forms. I am trying to avoid sing {{‪#‎if‬ variable}} {{/if}} per field.

Is there a way to remove the blank divs if field is hidden?

Upvotes: 0

Views: 84

Answers (2)

Edion Larosa
Edion Larosa

Reputation: 114

You can update you type schema to "none" and on your view:

<div class="form-group" style="display: {{type}}">
  Put your custype div/input fiel here
</div>

Disclaimer: not tested.

Upvotes: 1

Edion Larosa
Edion Larosa

Reputation: 114

You can create new helper:

isCompany: function(){
    return Autoform.getFieldValue("customerType") == "Company"; 
   // return true if custype is company
}

On your Customer div block:

{{#if isCompany}}
   Put your custype div/input fiel here
{{/if}}

--- with that, div block for company will onle be shown when custype is company .

Sorry if there are typos issues. I'm on mobile .

Upvotes: 0

Related Questions