I have implemented this jquerytokenizer in Ui Component form shown in the below image. enter image description here

It works well , the data is saved accurately- but when I go to edit a saved record this field is empty without the saved tags.

To serve the purpose I fetched the tags in afterload

    namespace Vendor\Module\Model\ResourceModel;

    use Magento\Framework\DB\Select;
    use Magento\Framework\Exception\LocalizedException;
    use Magento\Framework\Model\AbstractModel;
    use Magento\Framework\EntityManager\MetadataPool;
    use Magento\Framework\Model\ResourceModel\Db\AbstractDb;
    use Magento\Framework\Model\ResourceModel\Db\Context;
    use Magento\Store\Model\Store;
    use Magento\Store\Model\StoreManagerInterface;
    use Magento\Framework\EntityManager\EntityManager;

    class Article extends AbstractDb

    protected $_store = null;

    protected $_storeManager;

    protected $entityManager;

    protected $metadataPool;

    public function __construct(
        Context $context,
        StoreManagerInterface $storeManager,
        EntityManager $entityManager,
        MetadataPool $metadataPool,
        $connectionName = null
    ) {
        parent::__construct($context, $connectionName);
        $this->_storeManager = $storeManager;        
        $this->entityManager = $entityManager;
        $this->metadataPool = $metadataPool;

     * Initialize resource model
     * @return void
    protected function _construct()
        $this->_init('vendor_module', 'articles_id');

    protected function _afterLoad(AbstractModel $product)
        $articleId = $product->getId();
        $connection = $this->getConnection();
             $select = $connection->select()->from(['tag_table_name' => 'tag_table_name'])
                 ->where('tag_table_name.' . 'articles_id' . ' IN (?)', $articleId);
             $result = $connection->fetchAll($select);

        return parent::_afterLoad($product);

When I echo $result the result is

[0] => Array
        [id] => 7
        [articles_id] => 33
        [tag_names] => asdfasdf

[1] => Array
        [id] => 8
        [articles_id] => 33
        [tag_names] => adfasdfsad

[2] => Array
        [id] => 9
        [articles_id] => 33
        [tag_names] => fsdafdsafsdaf


My Ui Component form field is :

<field name="tag_names">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">   
                <item name="component" xsi:type="string">Vendor_Module/js/tags</item>

                <item name="template" xsi:type="string">ui/form/field</item>

                <item name="elementTmpl" xsi:type="string">Vendor_Module/form/element/tags</item>
                <item name="label" xsi:type="string">Article Tags</item>
                <item name="visible" xsi:type="boolean">true</item>
                <item name="dataType" xsi:type="string">text</item>
                <item name="formElement" xsi:type="string">input</item>
                <item name="source" xsi:type="string">article</item>

And the custom filed html is :

<select multiple class="admin__control-multiselect" data-bind="
attr: {
    name: inputName,
    id: uid,

    disabled: disabled,
    'aria-describedby': noticeId,
    placeholder: placeholder
hasFocus: focused,

selectedOptions: value,
optionsValue: 'label',
optionsText: 'label',
modtaggee: true"

Can any one figure out where I am going wrong or propose a solution. Thanks in Advance.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.