1

I've successfully created an admin grid using ui components. I've successfully added an actions column with a link. The link works but I want it to open in a new window or tab.

excerpt from ui_component

<actionsColumn name="actions" class="Vendor\Module\Ui\Component\Listing\Columns\Actions">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="indexField" xsi:type="string">id</item>
                <item name="sortOrder" xsi:type="number">1000</item>
            </item>
        </argument>
    </actionsColumn>

excerpt from Vendor\Module\Ui\Component\Listing\Columns\Actions

    /**
     * Prepare Data Source
     * The delete function will be added later
     *
     * @param array $dataSource
     * @return array
     */
    public function prepareDataSource(array $dataSource)
    {
        if (isset($dataSource['data']['items'])) {
            foreach ($dataSource['data']['items'] as &$item) {
                if (isset($item[AlertInterface::ID])) {
                    $item[$this->getData('name')] = [
                        'view' => [
                            'href' => $this->urlBuilder->getUrl(
                                $this->dataSourceSolver->getViewActionPath(),
                                [
                                    'id' => $item[AlertInterface::ID]
                                ]
                            ),
                            'popup' => true,
                            'target' => '_blank',
                            'label' => __('Preview')
                        ]
                    ];
                }
            }
        }
        return $dataSource;
    }
}

The link works but does not open in new tab or window. There is an example in Marketing >Email Templates > Preview section but that code uses widgets and I'm using ui_components.

Any help is appreciated.

Improve this question

3 Answers 3

Reset to default
2

In the grid_index.xml add the below code Namespace\Modulename\view\adminhtml\ui_component\grid_index.xml

<actionsColumn class="Namespace\Modulename\Ui\Component\Listing\Column\GroupIcon" name="preview">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="sortOrder" xsi:type="number">29</item>
                <item name="indexField" xsi:type="string">{{increment_id}}</item>
                <item name="label" xsi:type="string" translate="true">Attachment</item>
            </item>
        </argument>
    </actionsColumn>

Namespace\Modulename\Ui\Component\Listing\Column Here GroupIcon.php file in the respective actionClass in the above defined grid_index.xml file Use the below code with dataSource function

public function prepareDataSource(array $dataSource)
{
    if (isset($dataSource['data']['items'])) {
        foreach ($dataSource['data']['items'] as & $item) {
            $url = $this->_storeManager->getStore()->getBaseUrl().'pub/media/faq/tmp/icon/'.$item['icon'];
            if (isset($item['faqgroup_id'])) {  //"faqgroup_id" primary key in the database table
                $item[$this->getData('name')] = [
                    'preview' => [
                        'href' => $this->urlBuilder->getUrl($url),
                        'target' => '_blank',
                        'label' => __('Preview')
                    ]
                ];
            }
        }
    }

    return $dataSource;
}
Improve this answer
1
  • If I want to add custom class name in link, then what parameter I should to use?
    – Dhara Bhatti
    Commented Mar 1, 2019 at 13:09
0

Hello May be these following link will help you.

Magento 2. Grid Action column link open in new window

Magento 2: target="_blank" in UI Listing Action Links

Improve this answer
1
  • 1
    Dude you refereed this very question in the answer. Talk about inception.
    – vitoriodachef
    Commented Apr 24, 2018 at 12:02
0

add the following line. <item name="fieldAction" xsi:type="boolean">false</item>

<actionsColumn name="actions" class="Vendor\Module\Ui\Component\Listing\Columns\Actions">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="indexField" xsi:type="string">id</item>
                <item name="sortOrder" xsi:type="number">1000</item>
               <𝗶𝘁𝗲𝗺 𝗻𝗮𝗺𝗲="𝗳𝗶𝗲𝗹𝗱𝗔𝗰𝘁𝗶𝗼𝗻" 𝘅𝘀𝗶:𝘁𝘆𝗽𝗲="𝗯𝗼𝗼𝗹𝗲𝗮𝗻">𝗳𝗮𝗹𝘀𝗲</𝗶𝘁𝗲𝗺>
            </item>
        </argument>
    </actionsColumn>
Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.