WordPress.org

Ready to get started?Download WordPress

Forums

How to show posts in jQuery ui tabs via ajax? (5 posts)

  1. prionkor
    Member
    Posted 3 years ago #

    Hi, I am using ajax with wordpress for first time. I have a jquery ui tabs, in each tabs i will show differents types of post so i have to run a query_post via ajax. But the functions are shown undefined.

    Let me explain:

    Here is how i used the jquery ui tabs in ajax mode: http://jqueryui.com/demos/tabs/#Ajax_mode

    Tabs:

    <ul id="event_control" class="content_tab tabs">
                        	<li><a title="event-tab" href="<?php bloginfo('template_directory'); ?>/ajax/home/event_upcoming.php">Upcoming</a></li>
                        	<li><a title="event-tab" href="<?php bloginfo('template_directory'); ?>/ajax/home/event_ongoing.php">Ongoing</a></li>
                        	<li><a title="event-tab" href="<?php bloginfo('template_directory'); ?>/ajax/home/event_ended.php">Ended</a></li>
                        </ul>

    Container where the content will be loaded:

    <div id="event-tab">
    
                        </div>

    The idea is the when the tab is clicked the jquery will be load the linked php script in the container. Here is one php script that will be loaded.

    <?php
    $query = array(
    								'post_type' => 'event',
    								'meta_key' => 'start_time',
    								'meta_compare' =>'>=',
    								'meta_value'=>time(),
    								'meta_key' => 'start_time',
    								'orderby' => 'meta_value_num',
    								'order' => 'ASC',
    								'limit' => 3
    );
    
    query_posts($query);
    
    	 if(have_posts()) : while(have_posts()) : the_post(); ?>
                        <div class="content">
                        	<h1><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h1>
                            <?php if(get_post_meta($post->ID, 'address', true)): ?>
                            <p><span>Address:</span><?php echo get_post_meta($post->ID, 'address', true); ?></p>
                            <?php endif; ?>
                            <small>Remaining: 2 days 12 hours 15 mins and 36 secs</small>
                        </div>
                        <?php endwhile; endif;

    The jquery runs the php script in the server but it return the fatal error saying that the query_posts() is undefined. I guess this is not the right way to using ajax in wordpress because it running the particular script and has no idea about any other functions defined in other scripts. Please guide me.

    Let me know if anything unclear. Thanks!

  2. EFAREM
    Member
    Posted 3 years ago #

    Youd need to include the wp main header file otherwise none of the root functions are defined.

    Use this line at the top of the file, point it to the relevant location (usually root the root) and it should work.

    require('./wp-blog-header.php');

  3. prionkor
    Member
    Posted 3 years ago #

    Use this line at the top of the file, point it to the relevant location (usually root the root) and it should work.

    Not sure what you mean by this.

  4. Also - Tagging me in posts something I suggest people do when you need my help.

    I know jack about ajax and I generally don't do much for themes. So please stop tagging me in EVERY single post you have. Cause it's ticking me off :) I don't know everything, you know.

  5. EFAREM
    Member
    Posted 3 years ago #

    wp-blog-header.php is basically what loads everything and makes it work. When you download wordpress it's located in the root folder along with files such as index.php and license.txt.

    Use PHP's require function in the same way it is used in the index.php file, this will enable you to use functions such as query_posts.

    Does that make any sense?

Topic Closed

This topic has been closed to new replies.

About this Topic