I created a class to manage the configuration of my add-on, this works well apart from one thing: I would like to hide fields lal_login_text, lal_logout_text Y lal_account_text along with their labels generated by add_settings_field Yes there are icon selected in lal_display_type field. The icon is predetermined, so these fields should be hidden by default, but they will appear as soon as the user selects golf course from the drop-down

I tried to apply style = "display: none" based on the value selected in the function callbacks, but it worked only in the field, not on its label and the change took place after saving the configuration, not immediately.

Any help is appreciated.

class login_account_logout_settings {

$ private options;
private $ settings_page_name;
private $ settings_menu_name;

public function __build () {

$ this-> settings_page_name = & # 39; login-account-logout & # 39 ;;
$ this-> settings_menu_name = & # 39; Login Account Logout & # 39 ;;

// Initialize and register configurations.
add_action (& # 39; admin_init & # 39 ;, array ($ this, & # 39; register_settings & # 39;));
// Add configuration page.
add_action (& # 39; admin_menu & # 39 ;, array ($ this, & # 39; add_settings_page & # 39;));
// Add configuration link to the add-ons page.
add_action (& # 39; plugin_action_links _ & # 39 ;. plugin_basename (__FILE__), array ($ this, & # 39; add_settings_link & # 39;));
}

public function register_settings () {

register_setting (& # 39; lal_settingz & # 39 ;, & # 39; lal_settingz & # 39 ;, array ($ this, & # 39; sanitize & # 39;));

// ID / title / callback / page
add_settings_section (& # 39; configuration_section & # 39 ;, __ (& # 39; Configuration & # 39 ;, & # 39; login-account-logout & # 39;), array ($ this, & # 39; print_section_info & # 39;) , $ this-> settings_page_name);

// ID / title / callback / page / section
add_settings_field (& # 39; lal_display_type & # 39 ;, __ (& # 39; Screen Type & # 39 ;, & # 39; login-account-logout & # 39;), array ($ this, & # 39; lal_display_type_callback & # 39 ;), $ this-> settings_page_name, & # 39; configuration_section & # 39;);
add_settings_field (& # 39; lal_login_text & # 39 ;, __ (& # 39; Login link text & # 39 ;, & # 39; login-account-logout & # 39;), array ($ this, & # 39; lal_login_text_callback & # 39 ;), $ this-> settings_page_name, & # 39; configuration_section & # 39;);
add_settings_field (& # 39; lal_logout_text & # 39 ;, __ (& # 39; Logout link text & # 39 ;, & # 39; login-account-logout & # 39;), array ($ this, & # 39; lal_logout_text_callback & # 39 ;), $ this-> settings_page_name, & # 39; configuration_section & # 39;);
add_settings_field (& # 39; lal_account_text & # 39 ;, __ (& # 39; Text of the account link & # 39 ;, & # 39; login-account-logout & # 39;), array ($ this, & # 39; lal_account_text_callback & # 39;), $ this-> settings_page_name, & # 39; configuration_section & # 39;);
add_settings_field (& # 39; lal_position & # 39 ;, __ (& # 39; Position & # 39 ;, & # 39; login-account-logout & # 39;), array ($ this, & # 39; lal_position_callback & # 39;) , $ this-> settings_page_name, & # 39; configuration_section & # 39;);
add_settings_field (& # 39; lal_container & # 39 ;, __ (& # 39; Container selector & # 39 ;, & # 39; login-account-logout & # 39;), array ($ this, & # 39; lal_container_callback & # 39; ), $ this-> settings_page_name, & # 39; configuration_section & # 39;);
}

public function add_settings_page () {
// This page will be under "Settings"
add_options_page (
& # 39; Admin Settings & # 39 ;, $ this-> settings_menu_name, & # 39; manage_options & # 39 ;, $ this-> settings_page_name, array ($ this, & # 39; create_settings_page & # 39;)
);
}

/ **
* Get the option that is saved or the default.
*
* @param string $ index. The option that we want to obtain.
* /
public function lal_get_settings ($ index = false) {

$ defaults = array (& # 39; lal_display_type & # 39; => & # 39; icon & # 39 ;, & # 39; lal_login_text & # 39; => & # 39; Login & # 39 ;, & # 39; lal_logout_text & # 39 ; => & # 39; Log out & # 39 ;,
& # 39; lal_account_text & # 39; => & # 39; My account & # 39 ;, & # 39; lal_position & # 39; => & # 39; after & # 39 ;, & # 39; lal_container & # 39; => & # 39; nav.secondary-navigation & # 39;);
$ settings = get_option (& # 39; lal_settingz & # 39 ;, $ defaults);

if ($ index & & isset ($ settings[ $index ] )) {
return $ settings[ $index ];
}

returns $ settings;
}

public function create_settings_page () {

$ this-> options = $ this-> lal_get_settings ();

?>
        

            
Sign in Log out
            

            settings_page_name);
send button ();
?>
            
        
        
        
        
        <? php
}

public function add_settings_link ($ links) {
$ links = array_merge (array (
& # 39;& # 39 ;;
foreach ($ items like & $ item) {

$ selected = (isset ($ this-> options['lal_display_type'])) && ($ item == $ this-> options['lal_display_type'])? & # 39; selected = "selected" & # 39 ;: & # 39; & # 39 ;;
$ item = __ ($ item, & # 39; login-account-logout & # 39;);
printf (
& # 39;% 1 $ s& # 39 ;,
esc_attr ($ item),
$ selected
);
}
printf (
& # 39;
            
% 1 $ s
& # 39 ;,
__ (& # 39; Choose between an icon that leads to the My Account page and dynamic login / account / logoff links.) The icon saves space on the screen and appears immediately even for slow websites. The links offer direct access at the end of the session, but they take up more space and are displayed as soon as they execute the scripts on the website. & # 39;, & # 39; login-account-logout & # 39;)
);
}

public function lal_login_text_callback () {
printf (
& # 39;& # 39 ;,
isset ($ this-> options['lal_login_text'] )? esc_attr ($ this-> options['lal_login_text']): & # 39; & # 39;
);
}

public function lal_logout_text_callback () {
printf (
& # 39;& # 39 ;,
isset ($ this-> options['lal_logout_text'] )? esc_attr ($ this-> options['lal_logout_text']): & # 39; & # 39;
);
}

public function lal_account_text_callback () {
printf (
& # 39;& # 39 ;,
isset ($ this-> options['lal_account_text'] )? esc_attr ($ this-> options['lal_account_text']): & # 39; & # 39;
);
}

public function lal_position_callback () {

$ items = array (& # 39; before & # 39 ;, & # 39; after & # 39;);

eco & # 39;& # 39 ;;
foreach ($ items like & $ item) {

$ selected = (isset ($ this-> options['lal_position'])) && ($ item == $ this-> options['lal_position'])? & # 39; selected = "selected" & # 39 ;: & # 39; & # 39 ;;
$ item = __ ($ item, & # 39; login-account-logout & # 39;);
printf (
& # 39;% 1 $ s& # 39 ;,
esc_attr ($ item),
$ selected
);
}
printf (
& # 39;
            
% 1 $ s
& # 39 ;,
__ (& # 39; Choose if you want to show the icon / links before other items in the container (eg, shopping cart) or after them.If the container is empty, this setting will not make a difference. & # 39; , & # 39; login-account-logout & # 39;)
);
}

public function lal_container_callback () {
printf (
& # 39;
            
% 2 $ s
& # 39 ;,
isset ($ this-> options['lal_container'] )? esc_attr ($ this-> options['lal_container']): & # 39; & # 39 ;,
__ (& # 39; jQuery selector to find an element that serves as container for icons / links.) All popular CSS selectors and most of the less common selectors are valid jQuery selectors & # 39 ;, & # 39; login- account-logout & # 39;)
);
}
}

if (is_admin ()) {
$ lal_settingz_page = new login_account_logout_settings ();
}