WordPress settings API with tabs – options save only for an active tab

The problem is that whenever I activate tab and save options, all settings in the active tab remain as they are, but settings in other tabs reset to defaults. If possible, I would like to keep the settings together as eswc_settingz on a database. I present the code with only 2 tabs for better clarity:

// Create settings class.
class extra_settings_settings {

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

public function __construct() {

$this->settings_page_name = ‘woo-extra-settings’;
$this->settings_menu_name = ‘Woo Extra Settings’;

// Initialize and register settings.
add_action( ‘admin_init’, array( $this, ‘register_settings’ ) );
// Add settings page.
add_action( ‘admin_menu’, array( $this, ‘add_settings_page’ ) );
// Add settings link to plugins page.
add_action( ‘plugin_action_links_’ . plugin_basename( __FILE__ ), array( $this, ‘add_settings_link’ ) );
}

public function register_settings() {

register_setting( ‘eswc_settingz’, ‘eswc_settingz’, array( $this, ‘sanitize’ ) );

// ID / title / callback / page
add_settings_section( ‘general_section’, null, array( $this, ‘print_section_info’ ), $this->settings_page_name );
add_settings_section( ‘account_section’, null, array( $this, ‘print_section_info’ ), $this->settings_page_name );

// ID / title / callback / page / section /args
add_settings_field( ‘eswc_kill_gutenberg’, __( ‘Gutenberg’, ‘woo-extra-settings’ ), array( $this, ‘eswc_kill_gutenberg_callback’ ), $this->settings_page_name, ‘general_section’ );
add_settings_field( ‘eswc_change_email_author’, __( ‘WP core email author’, ‘woo-extra-settings’ ), array( $this, ‘eswc_change_email_author_callback’ ), $this->settings_page_name, ‘general_section’ );
add_settings_field( ‘eswc_redirect’, __( ‘Login redirect’, ‘woo-extra-settings’ ), array( $this, ‘eswc_redirect_callback’ ), $this->settings_page_name, ‘account_section’ );

}

public function add_settings_page() {
// This page will be under “Settings”
add_options_page(
‘Settings Admin’, $this->settings_menu_name, ‘manage_options’, $this->settings_page_name, array( $this, ‘create_settings_page’ )
);
}

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

$defaults = array ( ‘eswc_kill_gutenberg’ => false, ‘eswc_change_email_author’ => false, ‘eswc_redirect’ => false);
$settings = get_option( ‘eswc_settingz’, $defaults );

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

return $settings;
}

public function create_settings_page() {

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

?>
<div class=”wrap”>
<h1>Woo Extra Settings</h1>
<?php
$active_tab = isset( $_GET[ ‘tab’ ] ) ? $_GET[ ‘tab’ ] : ‘general’;
?>
<h2 class=”nav-tab-wrapper”>
<a href=”?page=woo-extra-settings&tab=general” class=”nav-tab <?php echo $active_tab == ‘general’ ? ‘nav-tab-active’ : ”; ?>”>General</a>
<a href=”?page=woo-extra-settings&tab=account” class=”nav-tab <?php echo $active_tab == ‘account’ ? ‘nav-tab-active’ : ”; ?>”>Account</a>
</h2>
<form method=”post” action=”options.php”>
<?php
// Output nonce, action, and option_page fields for a settings page.
if( $active_tab == ‘general’ ) {
settings_fields( ‘eswc_settingz’ );
echo ‘<table class=”form-table”>’;
do_settings_fields ($this->settings_page_name, ‘general_section’);
echo ‘</table>’;
} else if ( $active_tab == ‘account’ ){
settings_fields( ‘eswc_settingz’ );
echo ‘<table class=”form-table”>’;
do_settings_fields ($this->settings_page_name, ‘account_section’);
echo ‘</table>’;
}

submit_button();
?>
</form>
</div>
<?php

Read more here:: WordPress settings API with tabs – options save only for an active tab

Leave a Reply

Your email address will not be published. Required fields are marked *