WordPress在从URL获取参数的页面加载中使用Ajax

Question

So i am building a search on website, and main search form is on home page where user can input information's like, interests, books, movies.

And that form should submit to another page where search will be displayed. So it's similar like any other search, but on search page, i should keep parameters in url, so it's not going to be POST, it would be GET.

Home page is something like mywebsite.com

And when form is submitted it's posted with GET parameters so user can keep search results in his url. Submitted post should lead to something like.

mywebsite.com/search?interests=sports&books=harry+potter&movies=moviename

And because it can take some time to search and load results i would like to load the page and than do an ajax post to search function and populate search results once ajax responds.

I've built in past some ajax content loading and post and load data with ajax, but all that while keeping on same page, i never built when you submit content from one page to another in wordpress.

Any suggestions how can i do that and make ajax grab the content ?

Answer 1

I found the answer, and it's actually quite easy, instead triggering ajax with function, for example function with button click.

Just trigger ajax on page load, and don't enqueue script anywhere else except on that page, this would help a bit.

if ( is_page_template('template-search.php') ) {
    wp_enqueue_script('ajax_search');
}

This will ensure script is loaded only on that template page, and as for script it self, just load ajax on page ready:

jQuery(document).ready(function($) {
jQuery.ajax({
    dataType: 'json',
    url: search_flight.ajaxurl,
    data: {
        action: 'search_flight',
    },
    beforeSend: function() {

    },
    success: function(data) {
        console.log(data);
    },
    error: function() {
    }
});
});