php – 如何使选择列表的输出依赖于父列表?

我有两个具有父类别和子类别的数组,每个数组都出现在一个选择列表中,如何使子类别仅显示其父类别中的项目?
<?php $carMakes = array(
 'show_option_all'    => '','show_option_none'   => ('All Makes'),'orderby'            => 'ID','order'              => 'ASC','show_count'         => 0,'hide_empty'         => 1,'child_of'           => 25,'exclude'            => 0,'echo'               => 1,'selected'           => 0,'hierarchical'       => 0,'name'               => 'cat','id'                 => '','class'              => 'postform','depth'              => 0,'tab_index'          => 0,'taxonomy'           => 'category','hide_if_empty'      => false
); ?>

<?php $carModels = array(
 'name'               => 'subcat','hierarchical'       => 1,'parent'             => get_cat_id('model'),'show_option_none'   => ('All Models'),'hide_empty'   => 0  ); 
?>

<?php wp_dropdown_categories($carMakes); ?> 

<?php wp_dropdown_categories($carModels); ?>

例如,只需要展示属于汽车的汽车模型

Make=Toyota  Model=Supra
             Model=Corolla
             Model=Tundra

以下是类别结构的示例

Make (parent category)
     -Toyota
     -Nissan
     -Mazda
     -Ford

    Model (parent category)
     -Supra
     -Skyline
     -Mustang
     -Rx7
     -Corolla
一直想使用Ajax对链式选择进行练习,所以,在这里我们去;)

这是一个完整的插件,应该安装在wp-content / plugins / your-plugin-name文件夹中.由三个文件组成,插件本身,Javascript文件和Ajax加载器映像.

安装插件并激活,并在以下主题模板文件中插入以下内容:

<?php 
if( class_exists( 'BRSFL_Chained_Selection' ) ) {
    // Parameters: ( $cat_id,$dropdown_text )
    BRSFL_Chained_Selection::print_cats( 1,'All Makes' ); 
}
?>

另外,根据需要调整两次调用wp_dropdown_categories.查看代码注释以获取详细信息.

子类别下拉列表会根据类别下拉列表中的更改进行修改:

链-categories.php

<?php
/**
 * Plugin Name: Chained Categories
 * Plugin URI: https://stackoverflow.com/q/15748968/1287812
 * Description: Demonstration of chained categories with Ajax. 
 *   Plugin structure based on <a href="https://gist.github.com/3804204">Plugin Class Demo</a>,by Thomas Scholz.
 *   Use the dropdowns in the theme with this PHP method call: BRSFL_Chained_Selection::print_cats();
 * Author: Rodolfo Buaiz
 * Author URI: http://wordpress.stackexchange.com/users/12615/brasofilo
 */

add_action(
    'plugins_loaded',array ( BRSFL_Chained_Selection::get_instance(),'plugin_setup' )
);

class BRSFL_Chained_Selection
{
    /**
     * Plugin instance.
     *
     * @see get_instance()
     * @type object
     */
    protected static $instance = NULL;

    /**
     * URL to this plugin's directory.
     *
     * @type string
     */
    public $plugin_url = '';

    /**
     * Path to this plugin's directory.
     *
     * @type string
     */
    public $plugin_path = '';

    /**
     * Access this plugin’s working instance
     *
     * @wp-hook plugins_loaded
     * @since   2012.09.13
     * @return  object of this class
     */
    public static function get_instance()
    {
        NULL === self::$instance and self::$instance = new self;
        return self::$instance;
    }

    /**
     * Used for regular plugin work.
     *
     * @wp-hook plugins_loaded
     * @since   2012.09.10
     * @return  void
     */
    public function plugin_setup()
    {    
        $this->plugin_url    = plugins_url( '/',__FILE__ );
        $this->plugin_path   = plugin_dir_path( __FILE__ );
        $this->load_language( 'chainedselections' );

        add_action( 'wp_enqueue_scripts',array( $this,'script_enqueuer' ) );
        add_action( 'wp_ajax_custom_query','custom_query' ) );
        add_action( 'wp_ajax_nopriv_custom_query','custom_query' ) );
    }

    /**
     * Constructor. Intentionally left empty and public.
     *
     * @see plugin_setup()
     * @since 2012.09.12
     */
    public function __construct() {}    

    /**
     * Enqueue frontend scripts
     */
    public function script_enqueuer() 
    {
        wp_register_script( 
             'ajax-quote',plugin_dir_url( __FILE__ ) . '/ajax.js',array( 'jquery' ) 
        );

        wp_enqueue_script( 'ajax-quote' );

        wp_localize_script( 
             'ajax-quote','wp_ajax',array( 
                 'ajaxurl'  => admin_url( 'admin-ajax.php' ),'ajaxnonce' => wp_create_nonce( 'ajax_chained_selection_validate' ),'icon' => plugin_dir_url( __FILE__ ) . '/ajax-loader.gif' 
            ) 
        );
    }    

    /**
     * Ajax create sub-categories dropdown
     */
    public function custom_query()
    {
        // Security
        check_ajax_referer( 'ajax_chained_selection_validate','security' );

        // Check if jQuery posted the data
        if( !isset( $_POST[ 'chained_subcat_id' ] ) )
            return false;

        // Adjust parameters
        $carMakes = array(
            'show_option_all'    => '','show_option_none'   => 'All ' . $_POST[ 'chained_subcat_name' ],'hide_empty'         => 0,'child_of'           => $_POST[ 'chained_subcat_id' ],'name'               => 'chained-subcontainer','depth'              => 1,'hide_if_empty'      => false
        ); 

        // Print sub-categories
        wp_dropdown_categories( $carMakes );
        exit();
    }       

    /**
     * Loads translation file.
     *
     * Accessible to other classes to load different language files (admin and
     * front-end for example).
     *
     * @wp-hook init
     * @param   string $domain
     * @since   2012.09.11
     * @return  void
     */
    public function load_language( $domain )
    {
        $locale = apply_filters( 'plugin_locale',get_locale(),$domain );

        // Load translation from wp-content/languages if exist
        load_textdomain(
                $domain,WP_LANG_DIR . $domain . '-' . $locale . '.mo'
        );

        // Load regular plugin translation
        load_plugin_textdomain(
            $domain,FALSE,$this->plugin_path . '/languages'
        );
    }

    /**
     * Print the dropdown in the frontend
     */
    public static function print_cats( $cat_id,$dropdown_text )
    {
        // Adjust parameters
        $carMakes = array(
            'show_option_all'    => '','show_option_none'   => $dropdown_text,'child_of'           => $cat_id,'name'               => 'chained-categories','hide_if_empty'      => false
        ); 

        // Print categories
        wp_dropdown_categories( $carMakes );

        // Empty dropdown for sub-categories
        echo '<div id="chained-subcontainer">
                <select name="chained-subcategories" id="chained-subcategories">
                    <option value="">- Select a category first -</option>
                </select>
            </div>';
    }
}

ajax.js

jQuery( document ).ready( function( $) 
{ 
     var data = {
         action: 'custom_query',security: wp_ajax.ajaxnonce
     };

    $( "#chained-categories" ).on( "change",function( e ) 
    {
        // Add specific data to the variable,used to query the sub-categories
        data[ 'chained_subcat_id' ] = $( this ).val();
        data[ 'chained_subcat_name' ] = $(
            '#chained-categories option[value=' 
            + $( this ).val() 
            + ']'
            ).text();

        // A sub-category was selected
        if( $( this ).val() > 0 )
        {
            // Ajax loader icon 
            $( '#chained-subcontainer' ).html( '<img src="' + wp_ajax.icon + '">' );

            // Ajax call
            $.post( 
                wp_ajax.ajaxurl,data,// No error checking is being done with the response                
                function( response )
                {
                    $( '#chained-subcontainer' ).html( response );
                }
            );
        }
        // No selection,show default
        else
        {
            $( '#chained-subcontainer' ).html( '<select name="chained-subcategories" id="chained-subcategories"><option value="">- Select a category first -</option></select>' );
        }           
    });
} );

Ajax的loader.gif

相关文章

文章浏览阅读8.4k次,点赞8次,收藏7次。SourceCodester Onl...
文章浏览阅读3.4k次,点赞46次,收藏51次。本文为大家介绍在...
文章浏览阅读1.1k次。- php是最优秀, 最原生的模板语言, 替代...
文章浏览阅读1.1k次,点赞18次,收藏15次。整理K8s网络相关笔...
文章浏览阅读1.2k次,点赞22次,收藏19次。此网络模型提供了...
文章浏览阅读1.1k次,点赞14次,收藏19次。当我们谈论网络安...