Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save heldervilela/b7efd5c8eda825c2c017097fb5bd2914 to your computer and use it in GitHub Desktop.
Save heldervilela/b7efd5c8eda825c2c017097fb5bd2914 to your computer and use it in GitHub Desktop.
Demonstrates how a drop-down list can be updated dynamically in repeatable sections using Admin Page Framework.
<?php
/**
* Plugin Name: Admin Page Framework Demo - Dynamic Drop-down in Repeatable Sections
* Plugin URI: http://en.michaeluno.jp/admin-page-framework
* Description: Demonstrates how a drop-down list can be updated dynamically in repeatable sections.
* Author: Michael Uno
* Author URI: http://michaeluno.jp
* Version: 1.0.0
*/
include( dirname( dirname( __FILE__ ) ) . '/admin-page-framework/library/apf/admin-page-framework.php' );
if ( ! class_exists( 'AdminPageFramework' ) ) {
return;
}
class APFDemo_DynamicDropDownInRepeatableSections extends AdminPageFramework {
public function setUp() {
$this->setRootMenuPage( 'Settings' );
$this->addSubMenuItems(
array(
'title' => __( 'Dynamic Drop-down', 'admin-page-framework-demo' ), // page title
'page_slug' => 'dynamic_dropdown', // page slug
)
);
$this->addInPageTabs(
'dynamic_dropdown', // target page slug
array(
'tab_slug' => 'dynamic',
'title' => __( 'Dynamic', 'admin-page-framework-demo' ),
'script' => array(
'src' => dirname( __FILE__ ) . '/field-updater.js',
'in_footer' => true,
),
)
);
$this->setPageHeadingTabsVisibility( false );
$this->setInPageTabTag( 'h2' );
}
public function load() {
$this->addSettingSections(
array(
'section_id' => 'dynamic',
'title' => __( 'Dynamic', 'admin-page-framework-demo' ),
'repeatable' => true,
)
);
$this->addSettingFields(
'dynamic', // target section ID
array(
'field_id' => 'main_group',
'title' => __( 'Main Group', 'admin-page-framework-demo' ),
'type' => 'select',
'label' => array(
'a' => __( 'Group A', 'admin-page-framework-demo' ),
'b' => __( 'Group B', 'admin-page-framework-demo' ),
'c' => __( 'Group C', 'admin-page-framework-demo' ),
),
'default' => 'a',
),
array(
'field_id' => 'sub_groups',
'content' => array(
array(
'field_id' => 'sub_group_a',
'title' => __( 'Sub Group A', 'admin-page-framework-demo' ),
'type' => 'select',
'label' => array(
'one' => __( 'One', 'admin-page-framework-demo' ),
'two' => __( 'Two', 'admin-page-framework-demo' ),
'three' => __( 'Three', 'admin-page-framework-demo' ),
),
),
array(
'field_id' => 'sub_group_b',
'title' => __( 'Sub Group B', 'admin-page-framework-demo' ),
'type' => 'select',
'label' => array(
'four' => __( 'Four', 'admin-page-framework-demo' ),
'five' => __( 'Five', 'admin-page-framework-demo' ),
'six' => __( 'Six', 'admin-page-framework-demo' ),
),
),
array(
'field_id' => 'sub_group_c',
'title' => __( 'Sub Group C', 'admin-page-framework-demo' ),
'type' => 'select',
'label' => array(
'seven' => __( 'Seven', 'admin-page-framework-demo' ),
'eight' => __( 'Eight', 'admin-page-framework-demo' ),
),
),
),
)
);
}
public function content( $sHTML ) {
return $sHTML . get_submit_button();
}
}
new APFDemo_DynamicDropDownInRepeatableSections;
(function($){
$( document ).ready( function() {
var _sTriggerFieldID = 'main_group';
// Initial values.
$( 'select[name*="[' + _sTriggerFieldID + ']"]' ).each( function( iIndex ){
_showSubGroup( this );
} );
// For when the user selects the main group.
$( 'select[name*="[' + _sTriggerFieldID + ']"]' ).on( 'change', function( event ){
_showSubGroup( this );
} );
// For when a repeatable add button is clicked.
$( 'body' ).on( 'admin-page-framework_repeated_field', function( event ){
$( 'select[name*="[' + _sTriggerFieldID + ']"]' ).on( 'change', function(){
_showSubGroup( this );
} );
} );
} );
function _showSubGroup( nodeThis ) {
var _sMainGroupName = $( nodeThis ).val();
var _oSectionTable = $( nodeThis ).closest( 'table' );
var _sTargetField = 'sub_group_' + _sMainGroupName;
_oSectionTable.find( 'fieldset[id$="sub_groups"]' ).show();
_oSectionTable.find( 'fieldset[id$="' + _sTargetField + '"]' ).show()
.siblings( '.admin-page-framework-fieldset' ).hide();
}
}(jQuery));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment