Configuraciones dependientes en Magento

Normalmente, cuando creamos un módulo y le agregamos opciones de configuración, obtenemos un formulario, al menos, como el siguiente.

Está claro, el ejemplo es de lo más básico. Contamos con varios tipos de campos que nos permiten manejarnos con cierta flexibilidad al momento de definir nuestras configuraciones.

Dentro de esas posibilidades existe una opción (que no suele verse muy seguido) que nos permite indicar que si un campo cambia de valor, nos muestre (o no) otros campos.

Guiándonos por la primera imagen, la lógica sería la siguiente: si el campo “Condición” equivale a No, mostramos el campo “Valor A”.

Y ahora, si el campo “Condición” cambia a Si, ocultamos el campo “Valor A” y mostramos el campo “Valor B”.

Lograr el comportamiento es bastante sencillo (no, no es necesario enviar otro cohete a luna).

Repasemos el código usado para la primera imagen.

<fields>
    <condicion translate="label">
        <label>Condicion</label>
        <frontend_type>select</frontend_type>
        <source_model>adminhtml/system_config_source_yesno</source_model>
        <sort_order>1</sort_order>
        <show_in_default>1</show_in_default>
        <show_in_website>1</show_in_website>
        <show_in_store>1</show_in_store>
    </condicion>
    <valor_a translate="label">
        <label>Valor A</label>
        <frontend_type>text</frontend_type>
        <sort_order>2</sort_order>
        <show_in_default>1</show_in_default>
        <show_in_website>1</show_in_website>
        <show_in_store>1</show_in_store>
    </valor_a>
    <valor_b translate="label">
        <label>Valor B</label>
        <frontend_type>text</frontend_type>
        <sort_order>3</sort_order>
        <show_in_default>1</show_in_default>
        <show_in_website>1</show_in_website>
        <show_in_store>1</show_in_store>
    </valor_b>
</fields>

Desde Magento 1.4 existe un parámetro adicional que nos permite indicar la relación (y visibilidad) de un campo según el valor de otro.

El parámetro se llama “depends” e indica el campo con el que se relaciona y el valor que debe tener para que nuestro campo se muestre.

<depends>
    <condicion>0</condicion>
</depends>

El ejemplo completo nos quedaría de la siguiente forma.

<fields>
    <condicion translate="label">
        <label>Condicion</label>
        <frontend_type>select</frontend_type>
        <source_model>adminhtml/system_config_source_yesno</source_model>
        <sort_order>1</sort_order>
        <show_in_default>1</show_in_default>
        <show_in_website>1</show_in_website>
        <show_in_store>1</show_in_store>
    </condicion>
    <valor_a translate="label">
        <label>Valor A</label>
        <frontend_type>text</frontend_type>
        <sort_order>2</sort_order>
        <show_in_default>1</show_in_default>
        <show_in_website>1</show_in_website>
        <show_in_store>1</show_in_store>
        <depends>
            <condicion>0</condicion>
        </depends>
    </valor_a>
    <valor_b translate="label">
        <label>Valor B</label>
        <frontend_type>text</frontend_type>
        <sort_order>3</sort_order>
        <show_in_default>1</show_in_default>
        <show_in_website>1</show_in_website>
        <show_in_store>1</show_in_store>
        <depends>
            <condicion>1</condicion>
        </depends>
        <comment>Descripción del segundo campo</comment>
    </valor_b>
</fields>

Este pequeño truco nos permite mejorar la presentación de nuestra configuración con muy poco esfuerzo.

Cabe aclarar que no es la única forma en que podemos mejorar la forma de ingresar parámetros de configuración, ya que podemos implementar nuestros propios source para los campos.

Un ejemplo de esto último puede verse en el post de Robert Popovic sobre cómo implementar modelos personalizados para los parámetros de la configuración.

 

(Todavía no tengo seguridad sobre si el título describe correctamente el contenido del post)

Tweet about this on TwitterShare on Google+Email this to someoneDigg thisShare on TumblrBuffer this pageShare on FacebookShare on LinkedIn