How to switch metaboxes in wordpress?

Question

JavaScript

Hello everyone, I am creating a theme for wordpress on unyson. You need to display metaboxes in the admin panel, depending on the selected page template. Metaboxes display {theme}/framework-customizations/theme/options/posts/page.php. I switch options using the code:

$( "#fw-options-box-main_page" ).addClass( "option_hidden" );
  $( "#fw-options-box-about_me" ).addClass( "option_hidden" );

  $('#page_template').on('change', function() {
    $('#fw-options-box-about_me').toggleClass('option_hidden', this.value != 'about-me-page.php');
    $('#fw-options-box-main_page').toggleClass('option_hidden', this.value != 'home-page.php');
  });

But it does not work correctly, because the class only changes after a select, option from select'a 'page_template'. Please tell me the code, or another way to switch these functions.

Answer 1

var boxes = {
    'main_page': 'about-me-page.php',
    'about_me': 'home-page.php'
};

$('#page_template').on('change update:boxes', function() {
    var selected = this.value;

    $.each(boxes, function(id, template){
        $('#fw-options-box-'+ id)
            .toggleClass('option_hidden', selected != template);
    });
}).trigger('update:boxes');