Question

我有各种属性的转发器字段。在转发器区域内，我有一个关系子字段用于引用。单击“打开模态”按钮时，会弹出一个模态，并显示该属性的关联引用。一切正常，除了你点击哪个属性，它只显示第一个属性的引用。我尝试过重新定位;万一; wp_reset_postdata（）;但是无法解决这个问题。

以下是页面的the link。

以下是我的PHP代码：

<?php if( have_rows('api_properties') ): ?>
            <ul>
            <?php while ( have_rows('api_properties') ) : the_row(); ?>

                <li>

                <?php 

                    $name = get_sub_field('api_name'); 
                    $value = get_sub_field('api_value');
                    $posts = get_sub_field('api_references');
                ?>                          
                    <div class="w3-container">

                    <!-- Button trigger modal -->
                    <button onclick="document.getElementById('id01').style.display='block'" class="w3-button w3-black">Open Modal</button>
                    <p><?php echo $name; ?></p>
                    <p><?php echo $value; ?></p>

                    <div id="id01" class="w3-modal">
                        <div class="w3-modal-content">
                          <header class="w3-container w3-teal"> 
                            <span onclick="document.getElementById('id01').style.display='none'" 
                            class="w3-button w3-display-topright">&times;</span>
                            <h2>References</h2>
                            </header>

                        <div class="w3-container">
                        <ul>
                            <li class="header"><span>Title</span><span>Description</span><span class="number">Ref #</span><span>PDF</span></li>
                        </ul>
                        <?php if( $posts ): ?>
                                    <ul>
                                    <?php foreach( $posts as $p ): ?>
                                        <li>
                                            <span><a href="<?php echo get_permalink( $p->ID ); ?>">
                                                <?php echo get_the_title( $p->ID ); ?>
                                                </a></span>
                                            <span><?php echo get_field('reference_description', $p->ID); ?></span>
                                            <span class="number"><?php echo get_field('reference_number', $p->ID); ?></span>
                                            <span><?php echo get_field('reference_pdf', $p->ID); ?></span>
                                        </li>
                                    <?php endforeach; ?>
                                    </ul>

                                <?php endif; ?>

                          </div>
                          <footer class="w3-container w3-teal">
                            <p>Modal Footer</p>
                          </footer>
                      </div>
                     </div>
                    </div>

                    <p>&nbsp;</p>

            </li>

        <?php endwhile; ?>

            </ul>

        <?php endif; ?>
        <?php wp_reset_postdata(); ?>

Answer 1

问题在于按钮点击操作和模态的ID：

<button onclick="document.getElementById('id01').style.display='block'" ...
// Then later,
<div id="id01" class="w3-modal">

所有按钮都有相同的onclick处理程序，调用ID为id01的div，并且所有模态div的ID都为id01;所以，只有第一个显示。您需要在循环播放时增加ID。类似的东西（缩短了可读性）：

<?php if( have_rows('api_properties') ): ?>
  <?php $id_increment = 0; ?>
  <ul>
    <?php while ( have_rows('api_properties') ) : the_row(); ?>
      // Your setup
      <button onclick="document.getElementById('id0<?php echo $id_increment; ?>').style.display='block'" class="w3-button w3-black">Open Modal</button>
      // More markup
      <div id="id0<?php echo $id_increment; ?>" class="w3-modal">
      // Rest of your modal and list markup
      <?php $id_increment++; ?>
    <?php endwhile; ?>
  </ul>
<?php endif; ?>

每次循环通过＆＃34;行＆＃34;对于转发器，它将增加$id_increment变量，这将改变模态的ID和用于打开它的按钮。

嵌套关系ACF字段未调用正确的内容

1 个答案: