Search Panes with buttons

This demo uses a search pane to allow users to select a gender and country. Click the SEARCHPANES to show the sarch pane. Selections are reflected in the result table immediately. Search panes can be combined with global search, but cannot be combined with individual column search.

A search pane is a user friendly interface to help users to filter table data. Search Panes is a premium feature.

FirstnameLastnameGenderEmailPhone NoCountryCountyCityZipcodeAddressDate Of BirthRegistration DateID
FirstnameLastnameGenderEmailPhone NoCountryCountyCityZipcodeAddressDate Of BirthRegistration DateID

Shortcode arguments used for this demo

[wpdataaccess pub_id="12"]

Adding search panes to a publication

The following options where added to this publication to activate the search panes (read more). This also adds a number of buttons which are available with the premium version as well.

{
	"dom": "Bfrtip",
	"serverSide": false,
	"stateSave": false,
	"buttons": [
		{
			"extend": "searchPanes",
			"config": {
				"layout": "columns-2"
			}
		}
		,
		"copy", 
		"print", 
		"csv", 
		"excel", 
		"pdf"
	]
}

Limitations

  • Server-side processing is NOT support for search panes (serverSide must be false)
  • With serverSide = false all table data will be loaded to the client on page request
  • Search panes cannot be used for large tables

Notes

  • To activate the Search Panes add B to the dom option and configure option buttons (see code above)
  • A search pane can also be activate on page load (show demo)
  • Option serverSide must be false (see code above)