Show/Hide the Configuration grid/list/field in magento 2

Question

I am trying to show/hide the password text configuration filed based on the dropdown field and it's working fine & the code as follow.

 <depends>
                            <field id="integration">1</field>
                        </depends>

It will work based on depends property right.

    <section id="custom_general" translate="label" type="text" sortOrder="0" showInDefault="1" showInWebsite="1" showInStore="1">
   <group id="general" translate="label" type="text" sortOrder="1" showInDefault="1" showInWebsite="1" showInStore="1">
      <field id="integration" translate="label" type="select" sortOrder="3" showInDefault="1" showInWebsite="1" showInStore="1">
         <label>Integration Type</label>  
         <source_model>TinyXSolution\Integration\Model\Config\Source\Integration</source_model>
         <comment>Please Select Integration Type</comment>
      </field>
      <field id="custom_pwd" translate="label" type="obscure" sortOrder="4" showInDefault="1" showInWebsite="1" showInStore="1">
         <label>Password</label> 
         <backend_model>Magento\Config\Model\Config\Backend\Encrypted</backend_model>
         <depends>
            <field id="integration">1</field>
         </depends>
      </field>
   </group>
</section>

The same way I tried to show/hide the grid/list/field based on dropdown field which is in the custom_general section & the code as follow.

  <section id="custom_customer" translate="label" type="text" sortOrder="0" showInDefault="1" showInWebsite="1" showInStore="1">
   <group id="custom_customer_api" translate="label" type="text" sortOrder="1" showInDefault="1" showInWebsite="1" showInStore="1">
      <field id="custom_customer_general" translate="label" type="obscure" sortOrder="4" showInDefault="1" showInWebsite="1" showInStore="1">
         <label>Custom Configu.</label> 
         <frontend_model>TinyXSolution\Integration\Block\Adminhtml\Form\Field\Customer\Customerheader</frontend_model>
         <backend_model>Magento\Config\Model\Config\Backend\Serialized\ArraySerialized</backend_model>
         <depends>
            <field id="custom_general/general/integration" separator=",">0,1</field>
         </depends>
      </field>
   </group>
</section>

But it is still showing. for this I tried below condition.

<depends>
                <field id="custom_general/general/integration" separator=",">0,1</field>
             </depends>

Grid/List/field will show when 0 or 1 right. But I have selected the 2 still the grid/list/field showing.

Can you please help on this i.e where I went wrong?

Answer 1

Soled myself, by adding below code. However <depends> is not working for me when using different section, so I used to show/hide in the block file as below.

<?php

namespace TinyXSolution\Integration\Block\Adminhtml\Form\Field\Customer;

use Magento\Config\Block\System\Config\Form\Field\FieldArray\AbstractFieldArray;
use Magento\Framework\Data\Form\Element\AbstractElement;

class Customerheader extends AbstractFieldArray
{

    protected function _prepareToRender()
    {
        $this->addColumn('header', ['label' => __('Header')]);

        $this->_addAfter = true;
        $this->_addButtonLabel = __('Add Header');
    }

    public function render(AbstractElement $element)
    {
        $html = '';
        $configValue = $this->_scopeConfig->getValue('custom_general/general/integration');
        if ($configValue != "2") {
            return parent::render($element);
        } else {
            return $this->_decorateRowHtml($element, $html);
        }
    }

    public function _decorateRowHtml($element, $html)
    {
        return '<tr id="row_' . $element->getHtmlId() . '" style="display:none;">' . $html . '</tr>';
    }

}