troubleshooting Question

show all posts on page load - jQuery dropdown.

Avatar of Jon Imms
Jon ImmsFlag for United States of America asked on
PHPjQueryWordPress
32 Comments3 Solutions32 ViewsLast Modified:
Hi there,  
I have a page which will show past and future webinars (my CPT).
For this i have a dropdown, which will show the contents of a div associated with the value.
All is working, but on page load, the content is empty, just shows the dropdown as Topic.
If i select Business Management, those post will then show.
If it then select Topic, all posts show.

How can i modify my jQuery function, so that it displays "all-future" on page load. ? 


Part of php template
<div class="blog-filters">
            <div class="select-container">
                <select id="selectMe">
                    <option value="all-future">Topic</option>
                    <option value="business-management">Business management</option>
                    <option value="financials">Financials</option>
                    <option value="project-management">Project management</option>
                    <option value="sales-marketing">Sales and Marketing</option>
                    <option value="virtual-training">Virtual Training</option>
                </select>
            </div>
        </div> 

<div class="wp-block-group alignfull">
    <div class="wp-block-group__inner-container">

    <div class="wp-block-group tabbed-content all-future">
            <div class="wp-block-group__inner-container">

            <?php
                // All future webinars
                // get today's date
                $today = date( 'Y-m-d' );
 
                // get posts
                $futureposts_all = get_posts(array(
                    'post_type'         => 'webinar',
                    'posts_per_page'    => -1,
                    'orderby'           => 'meta_value',
                    'order'             => 'ASC',
                    'meta_query' => array(
                        array(
                            'key' => 'date_and_time',
                            'value' => $today,
                            'compare' => '>='
                      )
                    ),
                ));
               //var_dump( $futureposts_buisness );
                if( $futureposts_all ) : ?>
 
                <div class="row">
 
                <?php foreach( $futureposts_all as $post ) : setup_postdata( $post ); ?>


                    <div class="col-md-4"> 
                        <div id="block_5ed527ab633fb" class="wp-block-classic align block-desktop"> 
                            <div style="height: 600px !important;">      
                                <a class="aug20 card" style="cursor: pointer;"><p></p> 
                                <div class="card-image">
                                    <?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID), 'thumbnail' ); ?>
                                    <img src="<?php echo $url ?>" alt="Featured image of this webinar"/>
                                </div> 
                                <div class="card-text"> 
                                    <h3>
                                    <?php
                                        $seo_friendly_title = get_field( 'seo_friendly_title' );
                
                                            if ( $seo_friendly_title ) {
                                                echo $seo_friendly_title;
                                            } else {
                                                the_title();
                                            }
                                    ?>
                                    </h3>

                                    <p class="date"><?php echo the_field( 'date_and_time' ); ?> CDT</p>
                                    <p><?php the_excerpt(); ?></p> 
                                </div> 
                                </a>
                                <a class="card" style="cursor: pointer;"></a>
                                <p class="center-mob"><a class="plumb-button navy-ghost" href="<?php the_permalink(); ?>">Register</a> </p>
                            
                            </div> 
                        </div> 
                    </div>
                    <?php wp_reset_postdata(); ?>
                    <?php endforeach; ?>

                </div> <!-- End ROW -->
 
                <?php else: ?>
 
                <p>No upcoming webinars are scheduled</p>
        
                <?php endif;  ?>

            </div>
        </div><!-- END All future webinars -->

Open in new window



jQuery
jQuery(document).ready(function($) {
    $("#selectMe").change(function() {
        $(this).find("option:selected").each(function(){
            if($(this).attr("value")=="all-future"){
                $(".tabbed-content").not(".all-future").hide();
                $(".all-future").show();
            }else if($(this).attr("value")=="business-management"){
                $(".tabbed-content").not(".buisness-future").hide();
                $(".buisness-future").show();
            }else if($(this).attr("value")=="financials"){
                $(".tabbed-content").not(".financial-future").hide();
                $(".financial-future").show();
            }else if($(this).attr("value")=="project-management"){
                $(".tabbed-content").not(".project-future").hide();
                $(".project-future").show();
            }else if($(this).attr("value")=="sales-marketing"){
                $(".tabbed-content").not(".sales-future").hide();
                $(".sales-future").show();
            }else if($(this).attr("value")=="virtual-training"){
                $(".tabbed-content").not(".virtual-future").hide();
                $(".virtual-future").show();
            }else{
                $(".tabbed-content").hide();
            }
        });
    }).change();
});

Open in new window

ASKER CERTIFIED SOLUTION
Log in to continue reading
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform for $9.99/mo
View membership options
Unlock 3 Answers and 32 Comments.
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
See how we're fighting big data
The Value of Experts Exchange in My Daily IT Life

Experts Exchange (EE) has become my company's go-to resource to get answers. I've used EE to make decisions, solve problems and even save customers. OutagesIO has been a challenging project and... Keep reading >>

Mike

Owner of Outages.IO
Phoenix, Arizona, United States
Member Since 2016
Join a full scale community that combines the best parts of other tools into one platform.
Unlock 3 Answers and 32 Comments.
View membership options
“All of life is about relationships, and EE has made a virtual community a real community. It lifts everyone's boat.”
William Peck

Member since 2004