Как изменить динамически личиночную форму

Question

Я делаю веб-приложение на сериале. Я хотел бы сделать форму для поиска серий с различными критериями, такими как имя, создатель, жанр ...

Я хочу динамически менять второй вход. Если я хочу искать серию по имени, входным является текстовое поле. Если я хочу, чтобы поиск по жанру был вторым, это флажок.

Мой код:

 <!-- Ouverture du formulaire de recherche de série --> 
     {!! Form::open() !!} 

     <!-- Choix du type de recherche de série --> 
     <div class="form-group"> 
      <center>{!! Form::label('Type de recherche') !!}</center> 
      {!! Form::select('recherche', ['N' => 'Recherche par nom', 
              'G' => 'Recherche par genre', 
              'R' => 'Recherche par réalisateur'], 
      'G', ['class' => 'recherche select']); !!} 
     </div> 

     <!-- Champs de saisie du nom de la série recherchée --> 
     <div class="form-group nom"> 
      <center>{!! Form::label('Nom de la série recherchée') !!}</center> 
      {!! Form::text('nom', null, array('required', 'class'=>'form-control', 'placeholder'=>'Nom de la série')) !!} 
     </div> 

     <!-- Liste des checkboxs pour la recherche de séries par genre --> 
     <div class="form-group genre"> 
      <center>{!! Form::label('Nom du genre recherché') !!}</center> 
      Action{!! Form::checkbox('action', 'action') !!} 
      Western{!! Form::checkbox('western', 'western') !!} 
     </div> 

     <!-- Liste des checkboxs pour la recherche de séries par réalisateur --> 
     <div class="form-group realisateur"> 
      <center>{!! Form::label('Nom du réalisateur recherché') !!}</center> 
      Spielberg{!! Form::checkbox('Spielberg', 'Speilberg') !!} 
      Hanks{!! Form::checkbox('Hanks', 'Hanks') !!} 
     </div> 

     <!-- Bouton d'envoi du formulaire de recherche de série --> 
     {!! Form::submit('Rechercher', array('class'=>'btn btn-primary')) !!} 
     <!-- Fermeture du formulaire de recherche de série --> 
     {!! Form::close() !!} 

Этот JS код не изменяет второй вход динамически.

if($('.recherche').val() != 'N'){ 
    $('.nom').hide(); 
} 
if($('.recherche').val() != 'G'){ 
    $('.genre').hide(); 
} 
if($('.recherche').val() != 'R'){ 
    $('.realisateur').hide(); 
} 

Answer 1

Вы должны связать все в случае изменения:

$(".recherche").change(function() { 
    ..... 
});