3

I created one extenssion want to render some Pure HTML from the other blockand phtml file.

I have review some magento core code to render like this but not able to find the things.

In the review form magento still using generic class to render like this.

$fieldset->addField('customer', 'note', ['label' => __('Author'), 'text' => $customerText]);

    $fieldset->addField(
        'summary-rating',
        'note',
        [
            'label' => __('Summary Rating'),
            'text' => $this->getLayout()->createBlock(
                \Magento\Review\Block\Adminhtml\Rating\Summary::class
            )->toHtml()
        ]
    );

why magento still using generic class like this is there no way to do like this using UI form?

3
  • You need to make your own field type to render html. Oct 1 '18 at 10:41
  • @DharmendraJadav how do we do that in UI Form Oct 1 '18 at 10:49
  • I have added my answer please check. Oct 1 '18 at 10:54
1

Please add below code in you Form.php. I have make it for image html you can change as per your need.

$fieldset->addType('productimage', '\<Vendor>\<ModuleName>\Block\Adminhtml\Form\Edit\Tab\ImageRenderer');
    $fieldset->addField('product_image_url', 'productimage', array(           
       'label'     => __('Image')
    ));

And add ImageRenderer.php put there.

<?php

/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */

namespace <Vendor>\<ModuleName>\Block\Adminhtml\Form\Edit\Tab;

/**
 * Description of ImageRenderer
 *
 * @author dharmendra
 */
class ImageRenderer extends \Magento\Framework\Data\Form\Element\AbstractElement
{
    /**
     * get category name
     * @param  DataObject $row
     * @return string
     */
    public function getElementHtml()
    {
        // here you can write your code.
        $html = '';

        if ($this->getValue()) 
        {
            $html = $this->getMediaImageHtml($this->getValue());


        } 

        return $html;
    }

    public function getMediaImageHtml($imageName)
    {
        $objectManager = \Magento\Framework\App\ObjectManager::getInstance();
        $mediaUrl = $objectManager->get('Magento\Store\Model\StoreManagerInterface')
                            ->getStore()
                            ->getBaseUrl(\Magento\Framework\UrlInterface::URL_TYPE_MEDIA);
        $html = "<img src='".$mediaUrl.'catalog/product/'.$imageName."' height='100px' width='100px'>";        
        return $html;
    }
}

Still if you have any query let me know.

also you can add html like below.

$attribute->setAfterElementHtml("   
            <script type=\"text/javascript\">
            require([
                'jquery',
                'mage/template',
                'jquery/ui',
                'mage/translate'
            ],
            function($, mageTemplate) {
               $('#edit_form').on('change', '#page_attribute_id', function(event){
                $.ajax({
                   url : '". $this->getUrl('attributeicon/ajax/attributeoptions') . "attribute_id/' +  $('#page_attribute_id').val(),
                   type: 'get',
                   dataType: 'json',
                   showLoader:true,
                   success: function(data){
                    $('#page_option_id').empty();
                    $('#page_option_id').append(data.htmlconent);
                }
            });
        })
    }

);
</script>"
);
4
0

Yes, you can render Pure HTML from the other block and phtml file. A good example, Magento Customer module: admin customer edit form ui element customer_form.xml

app/code/Magento/Customer/view/base/ui_component/customer_form.xml

  <htmlContent name="customer_edit_tab_view_content">
        <block class="Magento\Customer\Block\Adminhtml\Edit\Tab\View" name="customer_edit_tab_view" template="Magento_Customer::tab/view.phtml">
            <arguments>
                <argument name="sort_order" xsi:type="number">10</argument>
                <argument name="tab_label" xsi:type="string" translate="true">Customer View</argument>
            </arguments>
            <block class="Magento\Customer\Block\Adminhtml\Edit\Tab\View\PersonalInfo" name="personal_info" template="Magento_Customer::tab/view/personal_info.phtml"/>
        </block>
    </htmlContent>

Using xml <htmlContent> you can add a block to Ui form.

7
  • that will be render as seprate html but i want it in the field like review do.but with UI form Oct 1 '18 at 10:47
  • Oah, you want to add field or tab ?
    – Amit Bera
    Oct 1 '18 at 10:49
  • Just field with its own html Oct 1 '18 at 10:49
  • 1
    Yes, possiable , but i have to check
    – Amit Bera
    Oct 1 '18 at 10:51
  • I have have a customer_id field in my admin form but when i edit, i want to show customer name instead of id in form same as in review edit we can see product name. i am using ui_component to render form. Mar 14 '19 at 7:24

Your Answer

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

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