cakephp 3中的链接下拉菜单
我有4个表categories
,subcategories
,product_types
和products
。每个都与以下层级中的其他人相关联。cakephp 3中的链接下拉菜单
categories
|- subcategories
|- product_types
|- products
的ProductsController
add()
采取行动的观点是
<?= $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
在列表中。我想在categories
和product_types
的变化上使用Ajax在subcategories
的变化上加载subcategories
。
没有很好的例子,我可以发现CakePHP的3.x和也有一些文件提到,js的助手已经从CakePHP的3
如何能在CakePHP中3实现去除我是新来的CakePHP和Ajax。
谢谢。
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(); ?>
并在您的ajax调用子类别如下。您可以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"));
});
}
});
}
});
从这个代码,你可以得到链接的下拉菜单创建相同的AJAX调用。它为你工作。
什么是行动准则。我试过这个,但它不起作用。我试着用行动'public function getSubcategories() {id} = $ this-> request-> data('id'); $ subcategories = $ this->子类别 - > find('all',[ 'conditions'=> [ 'category_id'=> $ id ] ]); echo json_encode($ subcategories); }' –
替换查找与列表功能,并尝试...其工作 –
感谢它的工作。我错过的是$('
提示:http://sandbox.dereuromark.de/sandbox/ajax-examples/chained-dropdowns :)它也包含源代码。 – mark