JS Objects

FacetWP uses a few different JS objects to store and handle data on the front-end. They’re each described below.

Viewing the data

To view each of the following objects, type its name into the browser console:

FWP

FWP contains the bulk of FacetWP’s data and logic. It contains a mixture of functions, variables, and data objects. Much of this is covered below.

Data objects

FWP.facets; // Contains each facet's selected values
FWP.extras; // Determines which extra features to use (pager, sort, etc)
FWP.hooks; // JS hook system, based on the WP_JS_Hooks library
FWP.settings; // Facet-specific settings, as well as some global data (e.g. FWP.settings.pager)
FWP.frozen_facets; // A low-level object to force certain facet types to only re-render when needed

Functions

FWP.refresh(); // Parse the facets and trigger an ajax refresh
FWP.reset(); // Reset all facets
FWP.fetchData(); // Make an ajax request
FWP.parseFacets(); // Apply any facet HTML changes to FWP.facets
FWP.setHash(); // Update the permalink URL
FWP.loadFromHash(); // Populates facet data from URL data (happens on pageload)
FWP.init(); // initializes all FacetWP event listeners

Variables

FWP.auto_refresh = true; // Whether or not to auto-refresh when a facet choice is selected
FWP.soft_refresh = false; // This is set to true when paging
FWP.is_refresh = false; // This is set to true when a refresh is active
FWP.is_reset = false; // This is set to true when resetting
FWP.loaded = true; // This remains true after FacetWP initializes

FWP_HTTP

FWP_HTTP contains data for the current page’s URI and its $_GET variables.

FWP_HTTP.get; // an object containing the page's $_GET variables
FWP_HTTP.uri; // the current page's URI (minus any beginning or trailing slashes)

FWP_JSON

FWP_JSON contains generally static data, such as the endpoint URL (ajaxurl) and the facet URL prefix. Here are examples of its data:

FWP_JSON.ajaxurl; // the current ajax endpoint URL
FWP_JSON.loading_animation; // the animation type, usually "fade" or "spin"
FWP_JSON.no_results_text; // the text that appears for "No results found" screens
FWP_JSON.nonce; // useful when making authenticated ajax requests
FWP_JSON.prefix; // the prefix for each facet's URL variable, usually "_" or "fwp_"

Examples

Let’s say you want to programmatically set a facet value and trigger a refresh. Your gut might tell you to use FWP.refresh(). Since this function parses the facets, it would actually overwrite the values you’re trying to set. Here’s a better way to do it:

FWP.facets['car_brand'] = ['audi'];
FWP.fetchData();