using jquery effect in configuration page for custom module in back office

[toanloau]

I have created config pages for my module this is a result:

I don't know use jquery effect, If Authentication is yes (ticked) 2 textbox is showed else it will disable.

this is my code for create it:

$fields_form[0]['form'] = array(
            'legend' => array(
                'title' => $this->l('Settings'),
            ),
            'input' => array(
                array(
                    'type' => 'text',
                    'label' => $this->l('Configuration value:'),
                    'name' => 'MYMODULE_NAME',
                    'size' => 20,
                    'required' => true,
                    'hint' => $this->l('Invalid characters:').' <>;=#{}',
                    'desc' => $this->l('To add "tags," click in the field, write something'),
                ),
                array(
                    'type' => 'radio',
                    'label' => $this->l('Authentication:'),
                    'name' => 'authentication',
                    'required' => false,
                    'is_bool' => true,
                    'class' => 't',
                    'values' => array(
                        array(
                            'id' => 'auth_on',
                            'value' => 1,
                            'label' => $this->l('Yes')
                        ),
                        array(
                            'id' => 'auth_off',
                            'value' => 0,
                            'label' => $this->l('No')
                        )
                    )
                ),
                array(
                    'type' => 'text',
                    'name' => 'username',
                    'label' => $this->l('Username:'),
                ),
                array(
                    'type' => 'password',
                    'name' => 'password',
                    'label' => $this->l('Password:'),
                ),

[tarek.fellah]

You can add js or css in the the getContent method in the configuration page, 

 if (method_exists($this->context->controller, 'addJquery')) {
            $this->context->controller->addJquery();
  }
   $this->context->controller->addJs($this->_path.'views/js/custom_script.js');        

Or in the hook hookDisplayBackOfficeHeader

public function hookDisplayBackOfficeHeader(){ 
    if (method_exists($this->context->controller, 'addJquery')) {
            $this->context->controller->addJquery();
    }
    $this->context->controller->addJs($this->_path.'views/js/custom_script.js'); 
}

Edited January 10, 2017 by tarek.fellah (see edit history)