如何在Magento 2的管理表单中添加自定义字段?


9

我已经使用UI组件在管理员中创建了一个表单,因此view/adminhtml/ui_component/[module]_[entity]_form.xml我拥有以下内容:

<field name="configuration">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="dataType" xsi:type="string">text</item>
            <item name="label" xsi:type="string" translate="true">Configuration</item>
            <item name="formElement" xsi:type="string">textarea</item>
            <item name="source" xsi:type="string">form</item>
            <item name="sortOrder" xsi:type="number">30</item>
            <item name="dataScope" xsi:type="string">configuration</item>
            <item name="validation" xsi:type="array">
                <item name="required-entry" xsi:type="boolean">true</item>
            </item>
        </item>
    </argument>
</field>

现在,我不想将此值设为textarea,但是我想在后端为此值创建自己的HTML魔术。这个“ HTML Magic”最终将是很多JS / KnockOut,在发布表单时,水下仍会发送一些隐藏数据,因此它必须是表单的一部分。我尝试通过添加添加渲染:

<item name="renderer" xsi:type="object">Vendor\Module\Block\Adminhtml\Renderer\Configurator</item>

但这仍会呈现文本区域。然后,我尝试用formElement自定义类替换,如下所示:

<item name="formElement" xsi:type="object">Vendor\Module\Component\Form\Element\Configurator</item>

但是然后我得到了错误:

The requested component ("Vendor\Module\Component\Form\Element\Configurator") is not found. Before using, you must add the implementation.

所以这里有两个问题:

  1. 这是向管理表单添加自定义表单元素的正确方法吗?(如果是这样:如何?)
  2. 无论如何:如何添加实现?我正在研究UI模块以了解他们是如何做到的,但是我什么也找不到。

Answers:


10

您可以检查他们提供的magento示例模块

<field name="color">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <!--component constructor-->
            <item name="component" xsi:type="string">Magento_SampleForm/js/form/element/color-select</item>
            <!--main template for form field that renders elementTmpl as a child template-->
            <item name="template" xsi:type="string">ui/form/field</item>
            <!--customized form element template that will show colors-->
            <item name="elementTmpl" xsi:type="string">Magento_SampleForm/form/element/color-select</item>
            <item name="label" xsi:type="string">Autumn colors</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">sampleform</item>
        </item>
    </argument>
</field>

谢谢!正是我要找的答案!我已经在考虑\Magento\Framework\View\Element\UiComponent\Config\Provider\Component\Definition::setComponentData()通过使用事件来添加自定义组件,但这要方便得多!我真的应该更多地研究那些Magento 2示例。
Giel Berkers '16

3

我不确定,但是我想shopping cart price rule会给你一些提示,这是示例

<field name="stop_rules_processing">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">boolean</item>
                    <item name="formElement" xsi:type="string">checkbox</item>
                    <item name="source" xsi:type="string">sales_rule</item>
                    <item name="prefer" xsi:type="string">toggle</item>
                    <item name="valueMap" xsi:type="array">
                        <item name="true" xsi:type="number">1</item>
                        <item name="false" xsi:type="number">0</item>
                    </item>
                    <item name="default" xsi:type="number">0</item>
                    <item name="label" xsi:type="string" translate="true">Discard subsequent rules</item>
                </item>
            </argument>
        </field>
        <container name="actions_apply_to" >
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">40</item>
                </item>
            </argument>
            <htmlContent name="html_content">
                <argument name="block" xsi:type="object">Magento\SalesRule\Block\Adminhtml\Promo\Quote\Edit\Tab\Actions</argument>
            </htmlContent>
        </container>

有关更多详细信息,您可以访问此文件

\vendor\magento\module-sales-rule\view\adminhtml\ui_component\sales_rule_form.xml


谢谢你的提示!这似乎只是添加了一段HTML内容。但是我需要创建一个复杂的表单元素,其中包含很多XHR加载的KnockOut逻辑。
吉尔·伯克斯

如何在管理中的产品编辑表单中添加自定义字段?
Jafar Pinjar
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.