Elementor中的另一个Select2字段填充Select2字段

Question

我有一个可以使用帖子类型的领域，我希望我的第二个Select2在第一个Select2中填充分类法。

我有一个为两者编写的函数，但是试图从“ post_type”中获取数据很棘手。

以下是在页面构建器中引起的AJAX加载问题。

我已经搜索了高低，但还没有找到解决方案。

提前致谢。

Answer 1

我能为您做的最好的是将此github插件插入
它使用JS来做到这一点，

这是该项目的链接：

widget.php：

$this->add_control(
            'post_type',
            [
                'label' => esc_html__( 'Select post type', 'void' ),
                'type' => Controls_Manager::SELECT2,
                'options' => void_grid_post_type(),                                
            ]
        );
        $this->add_control(
            'taxonomy_type',
            [
                'label' => __( 'Select Taxonomy', 'void' ),
                'type' => Controls_Manager::SELECT2,
                'options' => '',                               
            ]
        );

ajax.js

jQuery( function( $ ) {
    elementor.hooks.addAction( 'panel/open_editor/widget', function( panel, model, view ) {

        //get post type 
        $('[data-setting="post_type"]').change(function(){        
            $('[data-setting="taxonomy_type"]').empty();
            var post_type = $('[data-setting="post_type"]').val() || [];
            var data = {
                action: 'void_grid_ajax_tax',
                postTypeNonce : void_grid_ajax.postTypeNonce,
                post_type: post_type
            };        
            $.post(void_grid_ajax.ajaxurl, data, function(response) {        
                var taxonomy_name = JSON.parse(response);                 
                $.each(taxonomy_name,function(){
                    if(this.name == 'post_format'){
                        return;
                    }
                    $('[data-setting="taxonomy_type"]').append('<option value="'+this.name+'">'+this.name+'</option>'); 
                });
                $('[data-setting="taxonomy_type"]')[0].selectedIndex = -1;
            });
            return true;
        });
        $('[data-setting="taxonomy_type"]').change(function(){        
            $('[data-setting="terms"]')[0].options.length = 0;       
            var taxonomy_type = $('[data-setting="taxonomy_type"]').val();
            var data = {
                action: 'void_grid_ajax_terms',
                postTypeNonce : void_grid_ajax.postTypeNonce,
                taxonomy_type: taxonomy_type
            };      
            $.post(void_grid_ajax.ajaxurl, data, function(response) {        
                var terms = JSON.parse(response);                        
                $.each(terms,function(){
                    $('[data-setting="terms"]').append('<option value="'+this.id+'">'+this.name+'</option>'); 
                });
                $('[data-setting="terms"]')[0].selectedIndex = -1;
            });   
            return true;
        });
    } );

});

Answer 2

我认为可以通过创建您自己的 select2 控件并使用您自己创建的 js 文件传递​​选项来完成 elementor 小部件中的相同行为。