Archived

Difference between revisions of "How to add custom filters to components"

From Joomla! Documentation

m (version tutorial template and RightTOC)
m (moving overview heading to next line)
Line 1: Line 1:
{{version/tutor|1.7,2.5}}{{RightTOC}}== Overview ==
+
{{version/tutor|1.7,2.5}}{{RightTOC}}
 +
== Overview ==
 
This how-to is intended to give a decent description on how to add dropdown form elements to the backend admin page for a component.  I worked out the steps primarily on my own by dissecting/replicating the Banners component.  In particular, the 'banners' section of com_banners - not! to be confused with 'banner').
 
This how-to is intended to give a decent description on how to add dropdown form elements to the backend admin page for a component.  I worked out the steps primarily on my own by dissecting/replicating the Banners component.  In particular, the 'banners' section of com_banners - not! to be confused with 'banner').
  

Revision as of 21:00, 17 September 2012

This page has been archived. This page contains information for an unsupported Joomla! version or is no longer relevant. It exists only as a historical reference, it will not be improved and its content may be incomplete and/or contain broken links.

Overview[edit]

This how-to is intended to give a decent description on how to add dropdown form elements to the backend admin page for a component. I worked out the steps primarily on my own by dissecting/replicating the Banners component. In particular, the 'banners' section of com_banners - not! to be confused with 'banner').

In general, the process of adding these fields breaks down into the following steps:

  • Creating the class that will generate the form element
  • Adapting the view to display the form element
  • Adapting the model to retrieve data from DB & to set submission values in the Joomla 'state'
Frontend component note[edit]

I have followed and tested this approach and it's almost the exact same for the frontend component.
Might want to change and redirect this article's title though (with maybe some changes?).
(E-builds)

Extend JFormFieldList (models / fields / fieldname.php)[edit]

Frequently your filter fields will be very basic; probably simply a dropdown list of one of the columns being displayed on the current page. Regardless, you will need to create your own field element. This really isn't a big deal - this file will probably be less than 70 lines, including comments. The code below will generate the dropdown element to filter by companies. For more information and complex examples on creating this class see Creating_a_custom_form_field_type.

My 'companies' dropdown element:

<?php

defined('JPATH_BASE') or die;

jimport('joomla.html.html');
jimport('joomla.form.formfield');
jimport('joomla.form.helper');
JFormHelper::loadFieldClass('list');

/**
 * Custom Field class for the Joomla Framework.
 *
 * @package		Joomla.Administrator
 * @subpackage	        com_my
 * @since		1.6
 */
class JFormFieldMyCompany extends JFormFieldList
{
	/**
	 * The form field type.
	 *
	 * @var		string
	 * @since	1.6
	 */
	protected $type = 'MyCompany';

	/**
	 * Method to get the field options.
	 *
	 * @return	array	The field option objects.
	 * @since	1.6
	 */
	public function getOptions()
	{
		// Initialize variables.
		$options = array();

		$db	= JFactory::getDbo();
		$query	= $db->getQuery(true);

		$query->select('id As value, name As text');
		$query->from('#__my_companies AS a');
		$query->order('a.name');
		$query->where('state = 1');

		// Get the options.
		$db->setQuery($query);

		$options = $db->loadObjectList();

		// Check for a database error.
		if ($db->getErrorNum()) {
			JError::raiseWarning(500, $db->getErrorMsg());
		}

		return $options;
	}
}

Obviously, there is only one section here that needs to be customized:

		$query->select('id As value, name As text');
		$query->from('#__my_companies AS a');
		$query->order('a.name');
		$query->where('state = 1');

Change the database name and adjust the sql as necessary. This will produce the text and values for the select element options. I highly recommend not changing the value and text names. Although I did not test this theory, it seems likely that ancestor classes are expecting these names as keys in the resulting array.

Modify Model (models / zzz.php)[edit]

In your model you have to include these two functions:

protected function getListQuery(){
		$db = JFactory::getDBO();
		$query = $db->getQuery(true);

                //CHANGE THIS QUERY AS YOU NEED...
                $query->select('id As value, name As text');
		$query->from('#__my_companies AS a');
		$query->order('a.name');
		$query->where('state = 1');

		
		// Filter
		$search = $this->getState('filter.search');
		if (!empty($search)) {
			$query->where('(a.name LIKE '.$search.')');
		}
		
		return $query;
	}
	
	/**
	 * Method to auto-populate the model state.
	 *
	 * Note. Calling getState in this method will result in recursion.
	 *
	 * @since	1.6
	 */
	protected function populateState($ordering = null, $direction = null)
	{
		// Initialise variables.
		$app = JFactory::getApplication('administrator');
	
		// Load the filter state.
		$search = $this->getUserStateFromRequest($this->context.'.filter.search', 'filter_search');
		$this->setState('filter.search', $search);
	
		$state = $this->getUserStateFromRequest($this->context.'.filter.state', 'filter_state', '', 'string');
		$this->setState('filter.state', $state);
	
		// List state information.
		parent::populateState('a.name', 'asc');
	}

Extra fields and inside words[edit]

Here is a small modification to search in multiple fields in your database ánd to also search inside words.

// Filter
		$search = $this->getState('filter.search');
		if (!empty($search)) {
			$query->where('(a.name LIKE "%'.$search.'%" OR a.city LIKE "%'.$search.'%"));
		}

Modify View (views / zzz / view.html.php)[edit]

In you view class, you have to set the state, like this:

                $this->items		= $this->get('Items');
		$this->pagination	= $this->get('Pagination');
                //Add the state...
		$this->state		= $this->get('State');

Modify Template (views / zzz / tmpl / default.php)[edit]

In your template file, remember to include the html form to filter.

<div class="filter-search fltlft">
	<label class="filter-search-lbl" for="filter_search"><?php echo JText::_('JSEARCH_FILTER_LABEL'); ?></label>
	<input type="text" name="filter_search" id="filter_search" value="<?php echo $this->escape($this->state->get('filter.search')); ?>" title="<?php echo JText::_('COM_MYCOMPANY_SEARCH_IN_TITLE'); ?>" />
	<button type="submit"><?php echo JText::_('JSEARCH_FILTER_SUBMIT'); ?></button>
	<button type="button" onclick="document.id('filter_search').value='';this.form.submit();"><?php echo JText::_('JSEARCH_FILTER_CLEAR'); ?></button>
</div>

Extra: highlighting[edit]

Here is some extra to make your fields highlight the found search terms.

Add this somewhere at top of your template:

$searchterms = $this->state->get('filter.search');

//Highlight search terms with js (if we did a search => more performant and otherwise crash)
if (strlen($searchterms)>1) JHtml::_('behavior.highlighter', explode(' ',$searchterms));

And further in your template, enclose the specific fields with the default highlighter finder. (Be careful that your DOM is not breaken by the
tags (like it would wrongly placed between table tags for example).

Example:

<br id="highlighter-start" />
 <?php echo $item->name; ?>
<br id="highlighter-end" />

Contributors[edit]

Javier Constanzo

Doub1ejack

E-builds