Цепное выпадающее меню в cakephp 3

Question

У меня есть 4 стола categories, subcategories, product_types и products. Каждый из них связан с другим в следующей иерархии.

categories 
|- subcategories 
    |- product_types 
     |- products 

Вид add() действия ProductsController является

 <?= $this->Form->create($product, ['type' => 'file', 'class' => 'ajax_page']) ?> 
      <fieldset> 
       <legend><?= __('Add Product') ?> <div class="ajax_loading_image"></div></legend> 
       <?php 
        echo $this->Form->input('category_id', ['options' => $categories, 'empty' => true]); 
        echo $this->Form->input('subcategory_id', ['options' => $subcategories]); 
        echo $this->Form->input('product_type_id', ['options' => $productTypes]); 
        echo $this->Form->input('product_code'); 
        echo $this->Form->input('SKU'); 
        echo $this->Form->input('title'); 
        echo $this->Form->input('description'); 
      </fieldset> 
    <?php echo $this->Form->end(); ?> 

Прямо сейчас это список весь subcategories в списке. Я хочу загрузить subcategories об изменении categories и product_types об изменении subcategories с помощью Ajax.

Там не хороший пример, я могу нашел для CakePHP 3.x, а также некоторые документы отметил, что Js помощник был удален из CakePHP 3

Как это может быть реализовано в CakePHP 3. Я новичок в CakePHP и Ajax.

Thank you.

Answer 1

ctp файл, как показано ниже. здесь, в первую очередь, я даю id категориям полей, подкатегориям, типу продукции и товарному коду.

<?= $this->Form->create($product, ['type' => 'file', 'class' => 'ajax_page']) ?> 
    <fieldset> 
     <legend><?= __('Add Product') ?> <div class="ajax_loading_image"></div></legend> 
     <?php 
       echo $this->Form->input('category_id', ['options' => $categories, 'empty' => true,'id'=>'categories']); 
       echo $this->Form->input('subcategory_id', ['options' => '$subcategories','id'=>'subcategories']); 
       echo $this->Form->input('product_type_id', ['options' => '$productTypes','id'=>'producttype']); 
       echo $this->Form->input('product_code',['options'=>'$productcode','id'=>'productcode']); 
       echo $this->Form->input('SKU'); 
       echo $this->Form->input('title'); 
       echo $this->Form->input('description'); 
    </fieldset>  <?php echo $this->Form->end(); ?> 

и в вашем аякс-вызове для подкатегорий приведен ниже. Вы можете создать такое же АЯКС вызов для product_type и продукта кода

<script> 
    $("#categories").on('change',function() { 
     var id = $(this).val(); 

     $("#subcategories").find('option').remove(); 
     if (id) { 
      var dataString = 'id='+ id; 
      $.ajax({ 
       dataType:'json', 
       type: "POST", 
       url: '<?php echo Router::url(array("controller" => "yourcontroller", "action" => "youraction")); ?>' , 
       data: dataString, 
       cache: false, 
       success: function(html) { 
        //$("#loding1").hide(); 
        $.each(html, function(key, value) {    
         //alert(key); 
         //alert(value); 
         //$('<option>').val('').text('select'); 
         $('<option>').val(key).text(value).appendTo($("#subcategories")); 

        }); 
       } 
      }); 
     } 
    }); 

из этого кода вы можете получить прикованы выпадающее меню. его работа для вас.