coffeescript n'est pas mon div affin de

Question

Lorsque je clique sur mon lien formulaire href, je peux voir ma page web basculer rapidement entre les afficher et masquer le champ de texte Nom .

Je voudrais le champ texte du nom de rester affiché après que je clique sur le bouton de formulaire Lien.

J'ai essayé de changer toggle() pour montrer() et la même chose arrive où je ne peux pas obtenir le nom champ de texte pour rester affiché.

# app/views/forms/form.html.erb 
<%= link_to 'Form Link', '#', class: 'form-link' %> 
<div class="form-group"> 
    <div class="col-sm-1"><%= form.label :name, class: 'control-label' %></div> 
    <div class="col-sm-1"><%= form.text_field :name, class: 'form-control' %></div> 
</div> 

# app/assets/stylesheets/forms.scss 
.form-group { 
    display: none; 
} 

# app/assets/javascripts/forms.coffee 
$(document).on 'turbolinks:click', ('.form-link'), -> 
    $('.form-group').toggle() 

Answer 1

Si vous voulez simplement basculer la visibilité d'un div quand un lien est cliqué, alors vous devriez être en mesure d'écouter simplement clique sur le lien et éviter le comportement par défaut pour faire en sorte que turbolinks ne recharge pas la page. Cela devrait résoudre le problème que vous voyez. Lorsque vous cliquez sur le lien, votre script affiche le formulaire, mais turbolinks suit le lien (qui est #, donc il suffit de recharger la page).

Par exemple:

$(document).on 'click', '.form-link', (e) -> 
    e.preventDefault() # prevent link from being followed 
    $('.form-group').toggle() 

Vous pouvez l'essayer ici: https://jsfiddle.net/u9hngeo4/1/