Drop Down Multi-select category Ui Component

Question

I am using this code to create a multi-select category option in a form. It saves the data in the table correctly but when I try to edit it, it shows the selected category name in the field but doesn't show a checkbox(checked) in the drop down list. Instead It shows the Default Category box checked.

        <field name="category_id">
        <argument name="data" xsi:type="array">
            <item name="options" xsi:type="object">Magento\Catalog\Ui\Component\Product\Form\Categories\Options</item>
            <item name="config" xsi:type="array">
                <item name="label" xsi:type="string" translate="true">Category</item>
                <item name="componentType" xsi:type="string">field</item>
                <item name="formElement" xsi:type="string">select</item>
                <item name="component" xsi:type="string">Magento_Catalog/js/components/new-category</item>
                <item name="elementTmpl" xsi:type="string">ui/grid/filters/elements/ui-select</item>
                <item name="dataScope" xsi:type="string">category_id</item>
                <item name="filterOptions" xsi:type="boolean">true</item>
                <item name="showCheckbox" xsi:type="boolean">true</item>
                <item name="disableLabel" xsi:type="boolean">true</item>
                <item name="multiple" xsi:type="boolean">true</item>
                <item name="levelsVisibility" xsi:type="number">1</item>
                <item name="sortOrder" xsi:type="number">30</item>
                <item name="required" xsi:type="boolean">true</item>
                <item name="validation" xsi:type="array">
                    <item name="required-entry" xsi:type="boolean">false</item>
                </item>
                <item name="listens" xsi:type="array">
                    <item name="${ $.namespace }.${ $.namespace }:responseData" xsi:type="string">setParsed</item>
                </item>
            </item>
        </argument>
    </field>

Here is the screenshot.

Answer 1

I didn't used Data Provider

    <?php

namespace Vendor\Module\Model\Sales;

use Vendor\Module\Model\ResourceModel\Sales\CollectionFactory;
use Magento\Framework\App\Request\DataPersistorInterface;

/**
 * Class DataProvider
 */
class DataProvider extends \Magento\Ui\DataProvider\AbstractDataProvider
{
    /**
     * @var \Magento\Cms\Model\ResourceModel\Block\Collection
     */
    protected $collection;
    protected $dataPersistor;

    protected $loadedData;
    private $storeManager;

    public function __construct(
        $name,
        $primaryFieldName,
        $requestFieldName,
        CollectionFactory $salesCollectionFactory,
        DataPersistorInterface $dataPersistor,
        \Magento\Store\Model\StoreManagerInterface $storeManager,
        array $meta = [],
        array $data = []
    ) {
        $this->collection = $salesCollectionFactory->create();
        $this->dataPersistor = $dataPersistor;
        $this->storeManager = $storeManager;
        parent::__construct($name, $primaryFieldName, $requestFieldName, $meta, $data);
    }


    public function getData()
    {
        if (isset($this->loadedData)) {
            return $this->loadedData;
        }
        $items = $this->collection->getItems();

        /** @var \Magento\Cms\Model\Block $block */
        foreach ($items as $block) {

            $form = $this->loadedData[$block->getId()] = $block->getData();
            $form['category_id']=explode(',',$form['category_id']);
        }
        $data = $this->dataPersistor->get('sales');
        if (!empty($data)) {
            $block = $this->collection->getNewEmptyItem();
            $this->loadedData[$block->getId()] = $block->getData();
            $this->dataPersistor->clear('sales');
        }else {
        if ($items){
            if ($block->getData('banner') != null){
                $banner[$block->getSaleId()] = $form;
                return $banner;
            }
        }

    }
        return $this->loadedData;
    }
}