Filter is not working for a boolean datatype column in custom admin grid

Question

A custom table columns are displayed in the filter as well as in a grid.

Other filters are working fine except Is Notified column.

is_notified is the boolean type field.

Here is the code from xml file:

...
<column name="is_notified" class="Vendor\Notify\Ui\Component\Listing\Columns\IsNotified">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">text</item>
                    <item name="sorting" xsi:type="boolean">false</item>
                    <item name="label" xsi:type="string" translate="true">Is Notified</item>
                </item>
            </argument>
        </column>
... 

In the is_notified column, I am storing boolean values 0, 1. While displaying in the grid. I have displayed Yes for 1 and No for 0.

Vendor\Notify\Ui\Component\Listing\Columns\IsNotified.php

namespace Vendor\Notify\Ui\Component\Listing\Columns;

use Magento\Framework\View\Element\UiComponent\ContextInterface;
use Magento\Framework\View\Element\UiComponentFactory;
use Magento\Ui\Component\Listing\Columns\Column;
use Magento\Framework\UrlInterface;

/**
 * Class ProductActions
 *
 * @api
 * @since 100.0.2
 */
class IsNotified extends Column
{
    /**
     * @var UrlInterface
     */
    protected $urlBuilder;

    /**
     * @param ContextInterface $context
     * @param UiComponentFactory $uiComponentFactory
     * @param UrlInterface $urlBuilder
     * @param array $components
     * @param array $data
     */
    public function __construct(
        ContextInterface $context,
        UiComponentFactory $uiComponentFactory,
        UrlInterface $urlBuilder,
        array $components = [],
        array $data = []
    ) {
        $this->urlBuilder = $urlBuilder;
        parent::__construct($context, $uiComponentFactory, $components, $data);
    }

    /**
     * Prepare Data Source
     *
     * @param array $dataSource
     * @return array
     */
    public function prepareDataSource(array $dataSource)
    {
        if (isset($dataSource['data']['items'])) 
        {

            // column name for which this class is specified
            $fieldName = $this->getData('name');

            foreach ($dataSource['data']['items'] as &$item) 
            {
                if (isset($item[$fieldName])) 
                {
                    if( $item[$fieldName] == 0 )
                    {
                        $item[$fieldName] = "No";    
                    }

                    if( $item[$fieldName] == 1 )
                    {
                        $item[$fieldName] = "Yes";       
                    }
                }
            }
        }

        return $dataSource;
    }
}

When I enter keywords Yes or No in the Is Notified filter field then it returns No Records.

Any help would be appreciated. Thank you.

Answer 1

Instead of a custom column class and a text filter you can use the following XML configuration with your boolean attribute:

<column name="is_notified" component="Magento_Ui/js/grid/columns/select">
    <settings>
        <filter>select</filter>
        <dataType>select</dataType>
        <options class="Magento\Config\Model\Config\Source\Yesno"/>
    </settings>
</column>

The component="Magento_Ui/js/grid/columns/select" part makes sure that the text of the option is rendered instead of "0" or "1". The text comes from the YesNo source model, and the select filter gives you a dropdown instead of a text field: