如何使用 ACF 关系字段获取动态下拉列表答案

【问题标题】：How to get a dynamic dropdown with an ACF Relationship field如何使用 ACF 关系字段获取动态下拉列表
【发布时间】：2018-01-28 12:22:33
【问题描述】：

我的网站列出了课程和课程提供者。我正在使用 ACF 关系将提供者分配给每门课程。 课程和课程提供者都是自定义帖子类型我有每个课程页面的联系表，我需要从下拉列表中将查询发送给选定的课程提供者。我想要做的是有一个动态字段，一旦选择了提供商，将他们的电子邮件（分配为 acf 字段）获取到另一个表单字段并将表单提交到该特定电子邮件。我在以下代码中同时获得了分配的提供商列表和他们的电子邮件。

               <select name="supplier" id="supplier" class="form-control">
                    <option value="">---</option>
                    <?php
                    $posts = get_field('course_providers');
                    if( $posts ): ?>
                        <?php foreach( $posts as $post): ?>
                            <?php setup_postdata($post); ?>
                            <option value="<?php the_title(); ?>"><?php the_title(); ?></option>
                        <?php endforeach; ?>
                        <?php wp_reset_postdata(); ?>
                    <?php endif; ?>
                </select>

                <select name="supplier_email" id="supplier_email" class="form-control">
                    <option value="">---</option>
                    <?php
                    $posts = get_field('course_providers');
                    if( $posts ): ?>
                        <?php foreach( $posts as $post): ?>
                            <?php setup_postdata($post); ?>
                            <option value="<?php the_field('email_address'); ?>"><?php the_field('email_address'); ?></option>
                        <?php endforeach; ?>
                        <?php wp_reset_postdata(); ?>
                    <?php endif; ?>
                </select>

我希望这可以用 jQuery 来完成。

谢谢！

【问题讨论】：

标签： wordpress drop-down-menu html-select advanced-custom-fields

【解决方案1】：

为了方便起见，您可以将电子邮件地址作为数据属性添加到每个提供商标题的标签中，如下所示：

<select name="supplier" id="supplier" class="form-control">
                    <option value="">---</option>
                    <?php
                    $posts = get_field('course_providers');
                    if( $posts ): ?>
                        <?php foreach( $posts as $post): ?>
                            <?php setup_postdata($post); ?>
                            <option value="<?php the_title(); ?>" data-email="<?php the_field('email_address'); ?>"><?php the_title(); ?></option>
                        <?php endforeach; ?>
                        <?php wp_reset_postdata(); ?>
                    <?php endif; ?>
                </select>

然后在您的 jQuery 中，您可以执行以下操作：

$(document).ready(function() {
    $('select#supplier').change(function() {
        var emailAddress = $('select#supplier').find(':selected').data('email');
    });
    // Do something with the var emailAddress on form submit here
});

【讨论】：