Echo shortcode with repeater inside repeater via ajax

• GDdesign

• June 15, 2020 at 3:39 pm

Hello everyone,
i wonder with this question was asked before so I decided to write it in this forum:
in my site project that i Develop i need to display PDF file inside a popup, this is reports page.
So i make 2 repeaters – Main Repeater care for the month & year, inside i create another repeater that care for the report himself. (in the front every report is a box).
in the end of the file (page-reports.php) i create the popup mark-up that in the beginning i hiding his visibility and when user click on the link on the bottom of “Report” the popup show up and the PDF file seen.
i use the plugin “PDF Embedder” to show the pdf file so i use the shortcode of this plugin.
i now the best way is to use ajax , but how i do that ? how i reach the sub-field (field File, Because this is pdf file) in the second repeater and display it in the popup?

( i don’t so much expert in ajax, so i hope that you will be with patience )

Thanks in advance for any help

this is my code:

<section class="reports-wrraper">
    <div class="site-grid reports-grid">
        <div class="reports-content-container">
            <?php if( have_rows('foa-reports-repeater') ){ ?>
                    <?php while( have_rows('foa-reports-repeater') ) { the_row();                                             
                        // vars
                        $titleMonth = get_sub_field('reports-section-title-month');
                        $titleYear = get_sub_field('reports-section-title-year');
                        ?>
                        <h3 class="green"><?php echo $titleMonth ?>&nbsp;<?php echo $titleYear ?></h3>
                    <!-- Second Repeater --> 
                    <div class="reports-container">       
                        <?php if( have_rows('foa-reports-content-repeater') ){ ?>
                                <?php while( have_rows('foa-reports-content-repeater') ) { the_row();
                                    // vars
                                    $reportName = get_sub_field('report-name');
                                    $reportDate = get_sub_field('report-date');
                                    $reportImage = get_sub_field('report-image');                                                      
                                    $reportDownloadFile = get_sub_field('report-file-download');                                                      
                                    $reportSiteLink = get_sub_field('report-site-link');                                                      
                                ?>                                                         
                                  <div class="report-wrraper">
                                     <div class="report-name-date-wrraper">
                                          <div class="report-name"><h4><?php echo $reportName; ?></h4></div>
                                          <div class="report-date">Report Date<?php echo $reportDate; ?></div>
                                     </div>
                                     <div class="report-image">
                                           <img src="<?php echo $reportImage['url']; ?>" alt="<?php echo $reportImage['alt']; ?>" />
                                     </div>
                                     <div class="report-buttons-line">
                                         <?php if( get_sub_field('report-pdf-or-link') == 'report-pdf-file' ) {  ?>
                                         <a href="#" class="report-scale"><span class="icon-foa_scale_icon"></span>Open Popup</a><a href="<?php echo $reportDownloadFile['url']; ?>" class="report-download"><span class="icon-foa_download_icon"></span>Download PDF</a>
                                         <?php } else if(get_sub_field('report-pdf-or-link') == 'report-link') { ?>
                                         <a href="<?php echo $reportSiteLink; ?>" target="_blank" class="report-link"><span class="icon-foa_link_icon"></span>Link to website</a>
                                         <?php } ?>
                                     </div>
                                  </div> 
                                <?php } ?>
                        <?php } ?>
                    </div>        
                     <!-- End Second Repeater -->  
                 <?php } ?>  
            <?php } ?>
        </div>
    </div>
</section>

The popup mark up :

<!-- Popup Modal --->
<div class="popup-modal modal-overlay">
    <div class="popup-modal wrraper modal-transition">
        <div class="popup-modal close"><button class="popup-btn-close">X</button></div>
        <div class="popup-modal content">PDF File need the enter here</div>
    </div>
</div>