Como: Agregar un campo al formulario de edicion de producto en Magento 2


Agregar un campo al formulario de edición de producto en el admin es una de esas cosas que la primera vez se siente más difícil de lo que debería, porque el formulario es un Ui Component y no un layout normal. Una vez que sabes dónde engancharte, es solo un poco de XML.

Hay dos escenarios comunes. Si el campo corresponde a un atributo de producto real, el camino más fácil es crear el atributo EAV y aparecerá solo. Pero cuando necesitas un campo que no es un atributo estándar, o quieres colocarlo en un fieldset específico, extiendes el Ui Component product_form directamente. Ese es el caso que voy a cubrir.

Este post asume que existe ya un módulo de Magento con la ruta app/code/Vendor/Module. Si necesitas saber cómo crear un nuevo módulo, te recomiendo que le eches un vistazo a Cómo crear un nuevo módulo para Magento 2.

Extender el componente product_form

Magento fusiona cualquier product_form.xml que encuentre bajo view/adminhtml/ui_component/, así que no copiamos el archivo del core, solo declaramos la pieza que queremos agregar.

xml
<?xml version="1.0"?>
<!-- app/code/Vendor/Module/view/adminhtml/ui_component/product_form.xml -->
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    <fieldset name="product-details">
        <field name="my_custom_field" sortOrder="200" formElement="input">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="label" translate="true" xsi:type="string">My Custom Field</item>
                    <item name="source" xsi:type="string">product</item>
                </item>
            </argument>
        </field>
    </fieldset>
</form>

Eso coloca un input de texto dentro del fieldset product-details existente. Cambia formElement por select, checkbox, textarea, etc. según lo necesites.

Persistir el valor

Si my_custom_field es un atributo de producto real, Magento lo guarda por ti y no hay nada más que hacer. Si no lo es, llenas el formulario con un data provider modifier y lo guardas con un plugin/observer en el guardado del producto. Para la gran mayoría de los casos, sin embargo, crear primero el atributo es la ruta más simple y limpia.

Nota: Despliega el static content del admin (bin/magento setup:static-content:deploy -a adminhtml en producción) y limpia la caché, de lo contrario el formulario sigue renderizando el layout cacheado y jurarás que tu campo desapareció.

Espero que esto ayude.

Si tienes alguna pregunta o conoces una mejor manera de lograr esto, siéntete libre de compartir en los comentarios a continuación.