→ JS Variables


The FWP object gets passed to the server on each refresh. It contains all the necessary information for generating the template, facets, pagination, etc.

var FWP = {
    facets: {
        make: ['audi'],
        vehicle_type: ['car'],
        base_msrp: ['40100.00','106100.00']
    extras: {
        pager: true, // load pager HTML
        selections: true, // load selections HTML
        sort: 'default' // sort the results
    template: 'cars',
    auto_refresh: true, // set to FALSE to disable automatic refreshes
    soft_refresh: false, // used when sorting / paging to prevent a full refresh
    loaded: true, // this is TRUE after the first refresh
    paged: 1

Browse to our Cars demo, open your browser console, and type FWP to see actual data.

FWP Methods

// Reset all facets to their default state

// Force a refresh (use only when FWP.auto_refresh = false)

// Parse the URL hash to populate FWP.facets

// Parse the facet HTML values to populate FWP.facets

// Update the URL hash based on the values in FWP.facets

// Get the URL variable string
var str = FWP.build_query_string();


All requests happen via AJAX. In order for URI and GET variables to be available, they are passed using FWP_HTTP. Use $this->http_params within your FacetWP template to access.

Example URL:
var FWP_HTTP = {
    'uri': 'places/virginia',
    'get': {
        'county': 'loudoun',
        'city': 'leesburg'