Magento – Magento2 – Layered Navigation how to create multiselect functionality using code

magento-2.1magento-2.1.2magento2multiple-select-layered

Magento2 version is – 2.1.2

I am creating custom module for layered navigation and i want to create multiselect options functionality for layerednavigation.

I have already displayed checkbox over there by overriding the template of layered navigation in my custom module now what i need is how to select those checkbox as multiselect**.

I have seen there are lot of extenstions available for that but i
want to do it with code.is it possible ?

Is there any good tutorial to override layered navigation module and create this kind of functionality ?

Advance Thanks.

Best Answer

First of all you need to create you own/custom theme.. inside your theme directory create folder Magento_LayeredNavigation (if not available already) inside this folder copy the all template file from core module Magento\LayeredNavigation\view\frontend\templates into Magento_LayeredNavigation\template.

now you can override the layered navigation design and codes..

for multi-select you need to write the url, Sample url re-write method given as below you can customize it as per you requirement.

sample helper function given below..

public function getFilterUrls($params,$filter,$value){
    $currentCatUrl = $this->getCurrentCatUrl();
    unset($params['id']);
    unset($params['isAjax']);
    unset($params['_']);
    //$value = str_replace(',', '', $value);
    if (isset($params[$filter])) {
        $filterArray = explode(',', $params[$filter]);
        $checkValue = in_array($value, $filterArray);
        $remVelue = array_diff($filterArray, [$value]);
        $remVelue = implode(',', $remVelue);
    }
    if(isset($params[$filter]) and $params[$filter] == $value){
        unset($params[$filter]);
        $url = $currentCatUrl . '?' . http_build_query($params);
    }elseif (!empty($params[$filter]) && $params[$filter] !== ',' && $params[$filter] !== $value && $checkValue == FALSE) {
        $urlValues = $params[$filter];
        unset($params[$filter]);
        $url = $currentCatUrl . '?' . http_build_query($params) . '&' . $filter . '='.$urlValues.','.$value;
    }elseif (isset($params[$filter]) && $params[$filter] !== ',' && $params[$filter] !== $value && $checkValue == TRUE) {
        unset($params[$filter]);
        $url = $currentCatUrl . '?' . http_build_query($params) . '&' . $filter . '='.$remVelue;
    }
    else{
        unset($params[$filter]);
        $url = $currentCatUrl . '?' . http_build_query($params) . '&' . $filter . '=' . $value ;
    }
    return $url;
}

where $params = $this->getRequest()->getParams();

AND $filter is new/ old parameter name which you want make multiselect/select.

AND $value is the value you want for the parameter you passed..

AND $currentCatUrl current category url which you will get from registory.

call the above helper method in Magento_LayeredNavigation\template\view.phtml. Magento_LayeredNavigation\template\view.phtml is the file where you make the changes for layered navigation..

this will return the filter URL for both multiselect & sigle select.

update 1: formate example

<a href="<?php echo $block->escapeUrl($helper->getFilterUrls($params,'for','1')) ?>">
                <input type="checkbox" name="" value="l" id="check1"  <?php echo $this->getRequest()->getParam('for')=='1'?'checked':'' ?>>
                <label for="check1"> </label> <div class="anchor-text">Men</div>