Support

Account

Home Forums Front-end Issues How to use ajax to get custom posts without refreshing the page

Unread

How to use ajax to get custom posts without refreshing the page

  • Hello Everybody,

    I installed ACF on my wordpress and I would like to use ajax to get custom posts (events) without reloading the page.

    I use the following function to send parameters dynamically to display the posts.
    And I’ve created checkboxes as below for users to choose the parameters (cities and time).

    function get_events( $query ) {
        	if( is_admin() ) {
        		return $query;
        	}
        	if( isset($query->query_vars['post_type']) && $query->query_vars['post_type'] == 'events' ) {
        		if( isset($_GET['city']) ) {
            		$query->set('meta_key', 'city');
        			$query->set('meta_value', $_GET['city']);
        		}
        		if( isset($_GET['hour']) ) {
            		$query->set('meta_key', 'hour');
        			$query->set('meta_value', $_GET['hour']);
            	} 
        	}
        	return $query;
        }
        add_action('pre_get_events', 'get_events');

    Checkboxes (I repeat it for every city and every hour. For hour, name=hour)

    <form action="" method="get">
        <label for="city">
        <input name="city" type="checkbox" id="city" value="city" class="filled-in common_selector type"  onclick="if(this.checked){this.form.submit();}" />
        <span>Paris</span>
        </label>
    </form>

    The system works well. Except that logically, when you check a checkbox, the page reloads automatically. So you can’t combine “city and time” parameters at the same time (for example to display events that will take place in a city (parameter 1) in the morning (parameter 2).

    So I’m trying to use ajax to do this, but I’m not very comfortable with it yet. Will someone please help me.

    Thank you in advance.

Viewing 1 post (of 1 total)

The topic ‘How to use ajax to get custom posts without refreshing the page’ is closed to new replies.