Fields

PHP

The field class: Search_Filter\Fields\Field

The field instance class.

Function: get_attributes()

Description: Gets all the attributes for a query (most of the settings you can see in the query editor).
Return: associative array of attributes.
Use: $query->get_attributes()

Function: get_attribute( $attribute_name )

Description: Gets a single attribute by name.
Return: attribute value or null if attribute not found.
Use: $query->get_attribute('singleIntegration')

Function: get_id()

Description: Gets the field ID.
Return: the ID.
Use: $field->get_id()

Function: get_values()

Description: Gets the field values.
Return: the ID.
Use: $field->get_values()

Find a field

Returns: Search_Filter\Fields\Field or a WP_Error if not found.

By name

$field = \Search_Filter\Fields\Field::find( array(
	'name' => 'My field', // Field name
) );

var_dump( $field );

By ID

$field = \Search_Filter\Fields\Field::find( array(
	'id' => 123,
) );

var_dump( $field );

Find multiple fields

Returns: array of Search_Filter\Fields\Field

Find fields by status

$queries = \Search_Filter\Fields::find( array(
	'status' => 'enabled', // Only get enabled fields.
	'number' => 0, // Get all.
) );

var_dump($queries);

Get a fields active values

// Get the field by ID.
$field = \Search_Filter\Fields\Field::find( array(
	'id' => 123, // Replace 123 with your field ID.
) );

// Get a field value(s)
var_dump( $field->get_values() );

Modify a fields options

// Filter the choice options for a field and replace them with our own.
function demo_filter_choice_options( $options, $field ) {

	$field_id = $field->get_id();

	// Ensure we only filter a field with the ID `123`.
	if ( $field_id !== 123 ) {
		return $options;
	}

	// We could instead check a field attribute, such as data type:
	// $data_type = $field->get_attribute( 'dataType' );
	// if ( $data_type !== 'my_custom_data_type' ) {
	// return $options;
	// }

	/**
	 * Options can have:
	 * - label
	 * - value
	 * - count
	 * - depth
	 *
	 * Only value and label are required.
	 */
	$custom_options = array(
		array(
			'label' => 'Custom Option',
			'value' => 'custom_option',
			'count' => 10,
			'depth' => 0,
		),
		array(
			'label' => 'Custom Option 2',
			'value' => 'custom_option_2',
			'count' => 20,
			'depth' => 0,
		),
	);

	return $custom_options;
}

add_filter( 'search-filter/field/choice/options', 'demo_filter_choice_options', 10, 2 );

Custom Data Types + Queries

Important – this cannot be done from a theme, it must be run from a custom plugin.

Our hooks fire on plugins_loaded with a priority of 1 so the hooks must be setup before that, on a priority of 0.

To create your own data type, first we need to add the data type to the dataType setting.

Create and add a custom data type

// Register custom data type.
function demo_plugin_register_custom_data_type() {

	// Add custom field option to data type setting.
	$data_type_setting = \Search_Filter\Fields\Settings::get_setting( 'dataType' );
	if ( $data_type_setting ) {
		$custom_data_type = array(
			'label'     => __( 'My Custom Data Type', 'search-filter-pro' ),
			'value'     => 'my_custom_data_type',
			// Ensures its only displayed when an `Advanced` field type is selected
			// Warning: this will change in an upcoming version.
			'dependsOn' => array(
				'relation' => 'AND',
				'rules'    => array(
					array(
						'option'  => 'type',
						'compare' => '=',
						'value'   => 'advanced',
					),
				),
			),
		);

		$data_type_setting->add_option(
			$custom_data_type
		);
	}
}

// Add support for it for an input type.
add_action( 'search-filter/settings/register/fields', 'demo_plugin_register_custom_data_type', 20 );

Add input type support for the data type

// Add support for it for an input type.
function demo_plugin_add_custom_field_data_support( $data_support, $type, $input_type ) {

	// Add the `my_custom_data_type` to the Advanced -> Date Picker field.
	if ( $type === 'advanced' && $input_type === 'date_picker' ) {
		$data_support[] = array(
			'dataType' => 'my_custom_data_type',
		);
	}
	return $data_support;
}

add_filter( 'search-filter/field/get_data_support', 'demo_plugin_add_custom_field_data_support', 20, 3 );

Filter the WP_Query args based on the new field value

// Filter the query args based on the input type and data type.
function demo_plugin_filter_field_query_args( $query_args, $field ) {

	// Return early if the field doesn't use our custom data type.
	if ( $field->get_attribute( 'dataType' ) !== 'my_custom_data_type' ) {
		return $query_args;
	}

	// Return early if the isn't the input type we wanted
	if ( $field->get_attribute( 'inputType' ) !== 'date_picker' ) {
		return $query_args;
	}

	// Now we have the custom data type, we can update the query args based on the field value.
	// Use `get_value()` for fields that only need 1 value.
	$value = $field->get_value();
	// Use `get_values()` for fields that have multiple values.
	// $values = $field->get_values();

	// If there is no value, bail.
	if ( empty( $value ) ) {
		return $query_args;
	}

	// Create a custom meta query based on the field value.
	$query_args['meta_query'] = array(
		array(
			'key'     => 'my_custom_meta_key',
			'value'   => $value,
			'compare' => '>=',
		),
	);
	return $query_args;
}

add_filter( 'search-filter/field/wp_query_args', 'demo_plugin_filter_field_query_args', 20, 2 );

JavaScript

Get an array of all fields on the page.

const fields = window.searchAndFilter.frontend.fields.getAll();

for ( let i = 0; i < fields.length; i++ ) {
	const field = fields[i];

  // Get the field ID.
  console.log( field.getId() );
  // Get field attributes using getAttribute
  console.log( field.getAttribute('type') ); // search, choice, range, control
  console.log( field.getAttribute('queryId') ); // The connected query ID.
}

Get a single field by ID.

const fieldId = 123; // Replace `123` with your field ID.
const field = window.searchAndFilter.frontend.fields.get( fieldId );

if ( field ) {
  // Get the query ID.
  console.log( field.getId() );
  // Get query attributes using getAttribute
  console.log( field.getAttribute('type') ); // search, choice, range, control
  console.log( field.getAttribute('queryId') ); // The connected query ID.
}