{"id":48162,"date":"2025-06-10T10:07:42","date_gmt":"2025-06-10T10:07:42","guid":{"rendered":"https:\/\/crocoblock.com\/knowledge-base\/?post_type=article&p=48162"},"modified":"2026-02-24T15:53:09","modified_gmt":"2026-02-24T15:53:09","slug":"how-to-assign-ajax-search-to-current-query-listing-grid","status":"publish","type":"article","link":"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/","title":{"rendered":"How to Assign Ajax Search to the Current Query Listing Grid"},"content":{"rendered":"
<\/svg><\/div>
Things to know<\/div>

This use case is based on the BaliRento<\/strong><\/a> dynamic template.<\/p><\/div><\/div>\n\n\n\n

Build a Query<\/h2>\n\n\n\n
\n

Initially, let\u2019s build a query<\/a> for the listing that will be displayed on the archive page. To do it, proceed to the WordPress Dashboard > JetEngine > Query Builder <\/em><\/strong>and press the \u201cAdd New<\/strong>\u201d button.<\/p>\n\n\n\n

Name the query (here, \u201cProperties Current Query\u201d) and set the Query Type <\/strong>to \u201cCurrent WP Query<\/a>\u201d.<\/p>\n\n\n\n

Press the \u201cAdd new page type<\/strong>\u201d button in the Posts per page <\/strong>block of the Current WP Query <\/strong>section.<\/p>\n\n\n\n

\"general<\/a><\/div>\n\n\n\n

Pick the name of the post type you work with in the Page Type <\/strong>dropdown (for example, we select \u201cProperties.\u201d)<\/p>\n\n\n\n

Also, specify the Posts number <\/strong>that will be displayed later in the listing.<\/p>\n\n\n\n

\"current<\/a><\/div>\n\n\n\n

Ultimately, press the \u201cAdd Query<\/strong>\u201d button.<\/p>\n\n\n\n

Then, we want to add another query that will be used for the second listing displayed on the search page. To do so, proceed once again to the WordPress Dashboard > JetEngine > Query Builder <\/em><\/strong>and press \u201cAdd New<\/strong>\u201d.\u00a0<\/p>\n\n\n\n

Give a name to the query (here, \u201cProperties Query\u201d) and select the Query Type<\/strong> (here, the default \u201cPosts Query<\/a>\u201d).<\/p>\n\n\n\n

\"general<\/a><\/div>\n\n\n\n

Next, we select the Post Type <\/strong>that will be displayed in the listing. Here, we select the \u201cProperties\u201d option.<\/p>\n\n\n\n

Also, we press the \u201cAdd new sorting parameter<\/strong>\u201d button, select the \u201cBy title\u201d option in the Order By <\/strong>field, and the \u201cFrom lowest to highest values (1, 2, 3; a, b, c)\u201d option in the Order <\/strong>field.<\/p>\n\n\n\n

\"general<\/a><\/div>\n\n\n\n

Next, we also head to the Pagination <\/strong>tab and specify the \u201c3\u201d value in the Posts Per Page <\/strong>field so only three posts will be visible in the listing.<\/p>\n\n\n\n

\"pagination<\/a><\/div>\n\n\n\n

When the query is ready, press the \u201cAdd Query<\/strong>\u201d button.<\/p>\n<\/div><\/div>\n\n\n\n

Create an Archive Page<\/h2>\n\n\n\n
\n

Next, you should build an archive page for the post type you work with if you haven\u2019t done it before. It can be done with the help of the JetThemeCore<\/em><\/a> <\/em>plugin.<\/p>\n\n\n\n

Go to WordPress Dashboard > Crocoblock > Theme Builder <\/em><\/strong>and press the \u201cCreate new page template<\/strong>\u201d button.<\/p>\n\n\n\n

In the appeared window, press the \u201cAdd Condition<\/strong>\u201d button to specify the conditions.\u00a0<\/p>\n\n\n\n

Select the \u201cInclude,\u201d \u201cArchive,\u201d and \u201cAll (Your post type name) Archive\u201d options and click the \u201cCreate<\/strong>\u201d button.<\/p>\n\n\n\n

\"create<\/a><\/div>\n\n\n\n

You can set the header<\/a> and footer<\/a> if desired by pressing the \u201cOverride theme header\/footer<\/strong>\u201d buttons.<\/p>\n\n\n\n

However, we will focus on the template\u2019s body, so let\u2019s set it right away. To do so, click the \u201cOverride theme body<\/strong>\u201d button.<\/p>\n\n\n\n

In the opened menu, select either the \u201cCreate template<\/strong>\u201d button to build a template from scratch or the \u201cAdd from library<\/strong>\u201d button to pick the previously created template from the list. In our case, we push the \u201cCreate template<\/strong>\u201d button.<\/p>\n\n\n\n

\"create<\/a><\/div>\n\n\n\n

Set the template\u2019s name (optional) and select the preferred editor (here, we pick \u201cElementor\u201d). Then, press the \u201cCreate<\/strong>\u201d and \u201cGo to editor<\/strong>\u201d buttons.<\/p>\n\n\n\n

\"create<\/a><\/div>\n\n\n\n

In the editor, we first add a Heading <\/strong>with the \u201cSearch results:\u201d text to indicate that the following listing will contain the search results.<\/p>\n\n\n\n

\"the<\/a><\/div>\n\n\n\n

Add the Listing Grid <\/strong>widget<\/a>\/block<\/a> to the page.\u00a0<\/p>\n\n\n\n

Select the recently created Listing <\/strong>in the corresponding field (here, \u201cProperties Listing\u201d).<\/p>\n\n\n\n

\"general<\/a><\/div>\n\n\n\n

Head to the Custom Query <\/strong>tab and activate the Use Custom Query <\/strong>toggle.\u00a0<\/p>\n\n\n\n

Pick the previously built query (in our case, \u201cProperties Current Query\u201d) in the Custom Query <\/strong>dropdown list.<\/p>\n\n\n\n

\"custom<\/a><\/div>\n\n\n\n

Then, proceed to the Advanced <\/strong>tab and complete the CSS ID <\/strong>field with the desired value, which will later connect this listing with the Ajax Search<\/strong>. For instance, \u201clisting-grid-1\u201d.<\/p>\n\n\n\n

Adjust other widget settings as well if needed.<\/p>\n\n\n\n

\"advanced<\/a><\/div>\n\n\n\n

Next, we add one more Heading <\/strong>to the page. This time with the \u201cWe recommend:\u201d text.<\/p>\n\n\n\n

\"the<\/a><\/div>\n\n\n\n

Then, we add one more Listing Grid <\/strong>widget to the page. <\/p>\n\n\n\n

Select the desired Listing <\/strong>in the corresponding field. For example, we select the same \u201cProperties Listing.\u201d<\/p>\n\n\n\n

In the Custom Query <\/strong>tab, we select the \u201cProperties Query\u201d that we have built before for this listing.<\/p>\n\n\n\n

\"custom<\/a><\/div>\n\n\n\n

Next, we proceed to the Posts Query <\/strong>tab. You can adjust any other query for this Listing Grid <\/strong>except the \u201cCurrent WP Query\u201d one in the Custom Query <\/strong>tab.<\/p>\n\n\n\n

Here, we press the \u201cAdd Item<\/strong>\u201d button and select the \u201cMeta Query\u201d Type<\/strong>. The Key (name\/ID) <\/strong>is set to \u201ctop\u201d here as it is the \u201cRadio<\/a>\u201d meta field\u2019s Name\/ID<\/strong>, the Operator <\/strong>is set to \u201cEqual\u201d, and the Value <\/strong>to \u201cyes\u201d. So, only those posts that have the \u201cyes\u201d option selected in the \u201cTop\u201d meta field will be shown in the Listing Grid<\/strong>.<\/p>\n\n\n\n

\"posts<\/a><\/div>\n\n\n\n

Adjust other widget settings if needed and save the page by pressing the \u201cPublish<\/strong>\u201d button.<\/p>\n<\/div><\/div>\n\n\n\n

Add a Search Page<\/h2>\n\n\n\n
\n

Navigate to the WordPress Dashboard > Pages <\/em><\/strong>directory and create a page by clicking the \u201cAdd New<\/strong>\u201d button or selecting an already existing page.<\/p>\n\n\n\n

Add an Ajax Search <\/strong>widget to the page.<\/p>\n\n\n\n

\"search<\/a><\/div>\n\n\n\n

Paste the search results URL into the Custom Search Results URL<\/strong> field. Also, specify the Listing Grid<\/strong>\u2019s ID in the Target Widget ID (optional) <\/strong>field. Here, \u201clisting-grid-1\u201d<\/p>\n\n\n\n

Make sure that the Source <\/strong>used for the Listing Grid <\/strong>and the Ajax Search <\/strong>is the same.<\/p>\n\n\n\n

\"custom<\/a><\/div>\n\n\n\n

Customize the widget and page additionally if needed, and press the \u201cPublish<\/strong>\u201d button.<\/p>\n\n\n\n

\"ajax<\/a><\/div>\n<\/div><\/div>\n\n\n\n

Check the Result<\/h2>\n\n\n\n
\n

Head to the page where the Ajax Search <\/strong>is located.<\/p>\n\n\n\n

Enter your request in the search input area and press the \u201cSearch<\/strong>\u201d button.<\/p>\n\n\n\n

\"ajax<\/a><\/div>\n\n\n\n

Now, you will be redirected to the \u201cSearch Results\u201d archive page. Here, you will see only the first listing filtered, which is the needed one.<\/p>\n\n\n\n

\"the<\/a><\/div>\n\n\n\n

The second listing will be left as is.<\/p>\n\n\n\n

\"the<\/a><\/div>\n<\/div><\/div>\n\n\n\n

That\u2019s all about assigning an Ajax Query to the Listing Grid Current Query to limit search results on the archive page with the help of the JetSearch <\/em>plugin for WordPress.<\/p>\n","protected":false},"excerpt":{"rendered":"

Learn how to assign the Ajax Search to the specific Listing Grid with the help of JetSearch and JetEngine plugins for WordPress.<\/p>\n","protected":false},"author":9,"featured_media":0,"template":"","format":"standard","builder-category":[],"article-category":[430],"yoast_head":"\nHow to Assign Ajax Search to Current Query Listing Grid \u2014 JetSearch | Crocoblock<\/title>\n<meta name=\"description\" content=\"From this guide, learn how to assign the Ajax Search from JetSearch to a specific Listing Grid to limit search results on a WordPress Archive page.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Assign Ajax Search to Current Query Listing Grid \u2014 JetSearch | Crocoblock\" \/>\n<meta property=\"og:description\" content=\"From this guide, learn how to assign the Ajax Search from JetSearch to a specific Listing Grid to limit search results on a WordPress Archive page.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/\" \/>\n<meta property=\"og:site_name\" content=\"Help Center\" \/>\n<meta property=\"article:modified_time\" content=\"2026-02-24T15:53:09+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/06\/general-settings-section-of-the-current-wp-query-in-the-query-builder-1024x640.webp\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"9 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/\",\"name\":\"How to Assign Ajax Search to Current Query Listing Grid \u2014 JetSearch | Crocoblock\",\"isPartOf\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\"},\"datePublished\":\"2025-06-10T10:07:42+00:00\",\"dateModified\":\"2026-02-24T15:53:09+00:00\",\"description\":\"From this guide, learn how to assign the Ajax Search from JetSearch to a specific Listing Grid to limit search results on a WordPress Archive page.\",\"breadcrumb\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/crocoblock.com\/knowledge-base\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Articles\",\"item\":\"https:\/\/crocoblock.com\/knowledge-base\/articles\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"How to Assign Ajax Search to the Current Query Listing Grid\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/\",\"name\":\"Help Center\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/crocoblock.com\/knowledge-base\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#organization\",\"name\":\"Help Center\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg\",\"contentUrl\":\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg\",\"caption\":\"Help Center\"},\"image\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Assign Ajax Search to Current Query Listing Grid \u2014 JetSearch | Crocoblock","description":"From this guide, learn how to assign the Ajax Search from JetSearch to a specific Listing Grid to limit search results on a WordPress Archive page.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/","og_locale":"en_US","og_type":"article","og_title":"How to Assign Ajax Search to Current Query Listing Grid \u2014 JetSearch | Crocoblock","og_description":"From this guide, learn how to assign the Ajax Search from JetSearch to a specific Listing Grid to limit search results on a WordPress Archive page.","og_url":"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/","og_site_name":"Help Center","article_modified_time":"2026-02-24T15:53:09+00:00","og_image":[{"url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/06\/general-settings-section-of-the-current-wp-query-in-the-query-builder-1024x640.webp"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"9 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/","url":"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/","name":"How to Assign Ajax Search to Current Query Listing Grid \u2014 JetSearch | Crocoblock","isPartOf":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#website"},"datePublished":"2025-06-10T10:07:42+00:00","dateModified":"2026-02-24T15:53:09+00:00","description":"From this guide, learn how to assign the Ajax Search from JetSearch to a specific Listing Grid to limit search results on a WordPress Archive page.","breadcrumb":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-assign-ajax-search-to-current-query-listing-grid\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/crocoblock.com\/knowledge-base\/"},{"@type":"ListItem","position":2,"name":"Articles","item":"https:\/\/crocoblock.com\/knowledge-base\/articles\/"},{"@type":"ListItem","position":3,"name":"How to Assign Ajax Search to the Current Query Listing Grid"}]},{"@type":"WebSite","@id":"https:\/\/crocoblock.com\/knowledge-base\/#website","url":"https:\/\/crocoblock.com\/knowledge-base\/","name":"Help Center","description":"","publisher":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/crocoblock.com\/knowledge-base\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/crocoblock.com\/knowledge-base\/#organization","name":"Help Center","url":"https:\/\/crocoblock.com\/knowledge-base\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/","url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg","contentUrl":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg","caption":"Help Center"},"image":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article\/48162"}],"collection":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/users\/9"}],"wp:attachment":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/media?parent=48162"}],"wp:term":[{"taxonomy":"builder-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/builder-category?post=48162"},{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article-category?post=48162"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}