I have used below code to populate sub categories in other dropdown once the parent category is selected.
Used this code in my template file.
app/code/Vendor/Module/view/frontend/template/category.phtml
<div class="custom-dropdown">
<select id="parent-cat" name="parent-cat" onchange="getChildrenList(this.value)">
<option value ="">- Please Select -</option>
<option value ="3">Cat1</option>
<option value ="4">Cat1</option>
</select>
</div>
<div class="custom-dropdown center-cus-drop">
<select id="child-cat" name="child-cat" >
<option value ="">- sub category -</option>
</select>
</div>
<script>
function getChildrenList(parentId) {
var customurl = "<?php echo $this->getUrl().'frontname/category/childcategory' ?>";
jQuery.ajax({
url: customurl,
type: "POST",
data : 'category_id='+parentId,
dataType: 'json',
success : function(result) {
console.log('result',result);
}
});
}
</script>
app/code/Vendor/Module/Controller/Category/Childcategory.php
use Magento\Catalog\Api\CategoryRepositoryInterface;
use Magento\Catalog\Model\Category;
use Magento\Framework\App\Action\Action;
use Magento\Framework\App\Action\Context;
use Magento\Framework\Controller\Result\JsonFactory;
class Childcategory extends Action
{
protected $categoryRepository;
protected $resultJsonFactory;
public function __construct(Context $context, CategoryRepositoryInterface
$categoryRepository, JsonFactory $jsonFactory)
{
$this->categoryRepository = $categoryRepository;
$this->resultJsonFactory = $jsonFactory;
parent::__construct($context);
}
public function execute()
{
// get parent category
$parentId = $this->getRequest()->getParam('category_id');
/** @var Category $category */
$category = $this->categoryRepository->get($parentId);
$childrenData = [];
foreach ($category->getChildrenCategories() as $childrenCategory) {
$childrenData[] = [
'name' => $childrenCategory->getName(),
'id' => $childrenCategory->getId()
];
}
return $this->resultJsonFactory->create()->setData($childrenData);
}
}
When the main category drop down changes my ajax call is hitting and i am getting the result. I need to append the result to the sub category drop down.
How this can be done using magento 2 standards? can anyone help me on this please? Thanks in advance
Best Answer
Here at this link you can download complete module for multiple dropdown list of parent and child categories. https://www.magearray.com/category-dynamic-dependent-dropdown-extension-for-magento-2.html
Can You post a complete code and installation and usage procedure of Your drop down categories module?