double menu déroulant dynamique

salut à tous. Ayant fait plusieurs recherches, j'ai réussit à mettre sur pied un double menu déroulant dynamique donc je peut facilement le configurer pour (2,3,4 etc..) de niveau.
moi pour l'instant je suis à 3 niveau et mon soucis est que lorsque le premier menu est sélectioné le deuxième s'affiche avec déjà les données sélectionné et le deuxième une fois sélectionné m'affiche le troisième, mais lorsque je reselectionne le premier, le deuxième change aussi mais le troixième non ce qui cause problème car j'aimerais que lorsque le deuxième se charge automatiquement, que le troisième le fait aussi voici ce que j'ai comme script:

$(function()

{
  $('.ajaxliste').change(function(event)

      {

        var select = $(this);

        var id = '#'+select.data('target');
        $(window).load(function(){

          $('.ajaxliste').val() == 0;

        });

        if(($('.ajaxliste').val()) == 0)
        {
          $(id).parents('.jsclass').hide();
          return false;
        }
        else
        {
          $.get(select.data('url'), {id:select.val()}, function(data)
          {

                if(data.error)
                {
                  alert('Cet element n\' est pas encore configuré donc ne possède pas de donnée');
                }
                else
                {
               var target = $(id).get(0);
                target.options.length = 0;
               $(id).parents('.jsclass').show();

                    for(var i in data.resultatreq)
                    {
                        var result = data.resultatreq[i]; 
                        if(data.tab == 1)
                        {

                        target.options[i] = new Option(result.Filiere.nomclasse, result.Filiere.id, false, false);

                        }

                         if(data.tab == 2)
                        {

                        target.options[i] = new Option(result.Matiere.nommatiere, result.Matiere.id, false, false);

                        }

                    }

                }

          },'json');
        }

      }
    ).each(function()
    {

        var select = $(this);
        var target = $('#'+select.data('target'));
        target.parents('.jsclass').hide();
    });
});

dans ma vue j'ai ceci puisque j'utilise le framework cahephp 2.6

<table class="panel ">
                        <tr>
                            <td>

                                    <div class="  line-input spacecol">

                                        <?php   

                                        echo $this->Form->input('Attributionfiliere.personnels_id', array('label' => 'Enseignant','class'=>'form-control idresutat','type' => 'hidden'));

                                        ?>      

                                    </div>

                                    <div class="  line-input spacecol">

                                        <?php   

                                        echo $this->Form->input('enseignant', array('label' => 'Enseignant','class'=>'form-control resultatrecherche','type' => 'text','disabled' => true));

                                        ?>      

                                    </div>&nbsp;
                            </td>
                            <td>&nbsp;&nbsp;</td>
                                <td>
                                    <div class=" line-input ">
                                                        <?php   

                                                                echo $this->Form->input('Attributionfiliere.cycles_id', array('label' => 'Cycle *','empty' => array('--Choisir un Cycle--'),'class'=>'form-control ajaxliste classcycle','data-target' => 'idfiliere','data-url' => array('action' => 'listefiliere'),'options' => $listecycle,));

                                                         ?>     

                                    </div>
                            </td>

                        </tr>
                        <tr>

                            <td>

                                    <div class="line-input jsclass">
                                                        <?php   

                                        echo $this->Form->input('Attributionfiliere.filieres_id', array('label' => 'Classe *','empty' => array('---Choisir une Classe---'),'class'=>'form-control ajaxliste classfiliere','data-target' => 'idmatiere','data-url' => array('action' => 'listematiere'),'id' => 'idfiliere'));

                                                         ?>     

                                    </div>
                            </td>
                            <td>&nbsp;&nbsp;</td>
                            <td>

                                    <div class="line-input jsclass">
                                                        <?php   

                                            echo $this->Form->input('Attributionfiliere.matieres_id', array('label' => 'Matière *','empty' => array('---Choisir une Classe---'),'class'=>'form-control classmatiere','id' => 'idmatiere'));

                                                         ?>     

                                    </div>

                            </td>
                        </tr>

                        </table>