Question

这是我的多次下拉代码。

我有两个下拉菜单，一个用于城市，另一个用于区域。

因此，当有人选择城市时，区域下拉列表应自动填充。

这是网址

<?  

 $field_key = "field_570e68df39304"; 
 $field = get_field_object($field_key);


 if( $field == 'pune' )

    {  
        $field_key = "field_570e68df39304"; 
        $field = get_field_object($field_key);
            if( $field )
                {    
                    echo '<select name="city" class="form-control" id="city">';        
                    foreach( $field['choices'] as $k => $v )        
                        {
                            echo '<option value="' . $k . '">' . $v . '</option>';        
                        }    
                            echo '</select>';
                }
    }

elseif ( $field == 'akola' )
    {
        $field_key = "field_570e691b39305"; 
        $field = get_field_object($field_key);
        if( $field )
            {    
                echo '<select name="city" class="form-control" id="city">';        
                    foreach( $field['choices'] as $k => $v )        
                        {            
                            echo '<option value="' . $k . '">' . $v . '</option>';        
                        }    
                            echo '</select>';
            }   
    }
else
{
    ?>
    <select class="form-control">
    <option>Select Area</option>
    </select>
    <?
}

 ?>

Answer 1

在这种情况下，您可能必须在代码中使用一些ajax，以便在更改第一个下拉菜单的值时，它会触发ajax调用。要实现这一点，您必须包含一些像这样的JavaScript

$('#city_dropdown').change(function() {
    jQuery.ajax({
        url: "/wp-admin/admin-ajax.php",
        type: 'POST',
        data: {
            action: 'get_city_areas',
            city_id: $(this).val(),            
        },
        dataType: 'html',
        success: function (result) {
            $('#area-dropdown').html(result)
        },
        error: function (errorThrown) {
            console.log(errorThrown);
        }
    })
});

当您的城市下拉列表发生变化时，它会触发Ajax请求以获取所有相关区域。 Wordpress中的Ajax是通过admin-ajax系统完成的。您可以在此处详细了解：https://codex.wordpress.org/AJAX_in_Plugins

在你的functions.php文件中，您可以添加以下内容来注册Ajax调用以检索城市区域

add_action('wp_ajax_get_city_areas', 'handle_get_city_areas');
add_action('wp_ajax_nopriv_get_city_areas', 'handle_get_city_areas');
/**
 * Handle the list of areas
 */
function handle_get_city_areas(){
    $city_id = $_POST['city_id'];
    //Using the city ID, retrieve the related areas
    //and then echo the new select menu
}

这应该可以帮助你得到你想要的东西。

动态选择下拉Wordpress通过高级自定义字段

1 个答案: