使用AJAX在CakePHP 3.8.0中进行从属(链式)下拉菜单

时间:2019-07-01 21:14:07

标签: php ajax cakephp cakephp-3.0

我是CakePHP和ajax的新手。我试图弄清楚如何利用AJAX在CakePHP 3.8.0中进行依赖(链接)下拉菜单。

例如,我正在制作一些表格来学习如何构建链接的下拉菜单。我有三个表modelschaptersuserinputs。在Userinputs表中,我将基于模型章节加载。现在显示所有模型和所有章节。这就是他们所有的联系方式。 how all three tables are connected

我一直在网上查看一些示例,并尝试将其应用到我的代码中,但似乎没有任何效果。这是我的Userinputs表的add.ctp。

<div class="userinputs form large-9 medium-8 columns content">
<?= $this->Form->create($userinput, ['type' => 'file', 'class' => 'ajax_page']) ?>
<fieldset>
    <legend><?= __('Add Userinput') ?><div class="ajax_loading_image"></legend>
    <?php
        echo $this->Form->control('model_id', ['options' => $models, 'empty' => true, 'id'=>'models']);
        echo $this->Form->control('chapter_id', ['options' => $chapters, 'empty' => true, 'id'=>'chapters']);
    ?>
</fieldset>
<?= $this->Form->button(__('Submit')) ?>
<?= $this->Form->end() ?>

我还在Userinputs表的add.ctp末尾添加了此脚本

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

        $("#chapters").find('option').remove();
        if (id) {
            var dataString = 'id='+ id;
            $.ajax({
                dataType:'json',
                type: "POST",
                url: '<?php echo Router::url(array("controller" => "Userinputs", "action" => "getChapters")); ?>' ,
                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($("#chapters"));

                    });
                } 
            });
        }
    });
</script>

Userinputs的控制器中,我添加了一个公共函数

public function getChapters() 
{ 
    $id = $this->request->data('id'); 
    $chapters = $this->Chapters->find('all', [ 'conditions' => [ 'model_id' => $id ] ]); 
    echo json_encode($chapters); 
}

请查看我的代码,并协助我如何使其正常工作。任何帮助深表感谢。

0 个答案:

没有答案