Adding search feature to Component Frontend list view

update: breeds.php         /site/models/breeds.php

update: view.html.php   /site/views/breeds/view.html.php

update: default.php       /site/views/breeds/tmpl/default.php

update: en-GB.com_breed.ini   /languages/site/en-GB/en-GB.com_breed.ini

 File Details


	if ($filters = $app->getUserStateFromRequest($this->context . '.filter', 'filter', array(), 'array'))
			foreach ($filters as $name => $value)
				$this->setState('filter.' . $name, $value);

Adding the search filters to populateState in the model

In the populatestate method, as I have described in the previous two steps that first of all, we initialize a variable called $app which will actually hold the Joomla application object. I have described $limit, $limitstart, $ordering, $orderingDirection properties is detail in the last two steps. So, if you have directly come to this part of tutorial, I will suggest you to go through last two steps of the tutorial to gain a full idea of what this populatestate method is doing and what we have done with listing ordering and pagination.

In this part of tutorial, I am primarily focusing on the code from line 21 to 27 of the above mentioned breeds.php model file, residing in the models directory. This would be somewhat difficult for a new comer but I am explaining it as simple as I can. As we are implementing search feature and category filtering on breeds listing, in this part, so this code is mainly related to that. On line 21, we are getting the state of all the form objects which name attribute is declared as a filter array, like, filter[], so for the search field, it would be like, filter[‘search’] and for category it would be like, filter[‘category’] and for language filet, it would be like filter[‘language’]. So, on line 21, we are getting all the values of the filter fields and passing these to an array, which will temporarily hold it.

After that, on line 23, there is a foreach loop on two dimensional array of $filters, holding field names and values. Then on line 25, we are assigning those values to the current state of request by calling setstate method through $this specifier. I have commented the code on line 29 and 32. In the instance, where you only have a search filter and no other filters are there, then this piece of code would be the good replacement to the upper mentioned foreach code, i.e, getting all filter fields values in an array. The reason why I am saying this is, the foreach process would be a little slow than getting the field individually because it will go for all the filter fields first and then apply a loop on the array to get and assign only a single value. So, it makes the process a little bit slow.

The structure of the code of two lines, 30 and 31 is similar to that of $limit and $limitstart properties on 15 and 19. If you want more explanation regarding it, you can go through previous two steps where I have explaianed each and every argument of getUserStateFromRequest in great detail.

	$search = $this->getState('');

		if (!empty($search))
			if (stripos($search, 'id:') === 0)
				$query->where(' = ' . (int) substr($search, 3));
				$search = $db->Quote('%' . $db->escape($search, true) . '%');
                                $query->where('( a.breedname LIKE '.$search.' )');
		// Filtering breed category
		$filter_breedcat = $this->state->get("filter.breedcat");
		if ($filter_breedcat != '') {
			$query->where("a.breedcat = '".$db->escape($filter_breedcat)."'");

Now we have to make the adjustments to the query in the getListQuery() method according to what we have added to populateState() method. In the getListQuery() from line 93 to 112, we have added some new code regarding search and category filter option. Let us go through it. The first filter, from line 93 to 101 is for the search filter. We have gotten the search value from the populatestate() and have assigned it to a $search variable. After that we will check that whether the variable is empty or not, and if it is, we will leave it and if it is not, we will try to setup a search query.

First we will set up a case for searching an item through its unique ID. If it is true, we will add a WHERE clause to the main query where we are taking id equal to the string part after the prefix “id:” and will take this postfix vale as intefer because we would require integer value to be searched in the ID column of our table. If we dont find any prefix in the previous step, we will create a search for the breed title. First we will sanitize the input string becausee the user input cant be trusted. There could be malicious code injection in the search string which can create security issues. To achieve this, we will use quote and escape method. The escape function properly escapes all the unnecessary or malicious characters and thus stops the errors being generated by the query by stopping SQL injection attacks. Now, what the quote method do is, it first filters the search string through escape method and then according to the database engine, wraps this string in proper quotes. As we are using MySQL, so it would be single quotes.  Similarly from line 108 to 112, we have done the same. as we have done for search query. Here, we are making a search on the basis of selected breed category. We are assigning the vale of breedcat field to $filter_breedcat variable and on its basis, making a query, assuming that this is not an empty variable or its value is not equal to blank.


   $this->filterForm = $this->get('FilterForm');
   $this->activeFilters = $this->get('ActiveFilters');

In this step, we have added two lines of code to our view.html.php as shown in lines 20 and 21. These code lines are fetching FilterForm and ActiveFilters objects from model and assigning these so that these could be used in the default.php template file fir getting the filter form fields and active filters.


echo JLayoutHelper::render('joomla.searchtools.default', array('view' => $this));

To display the search filters, we need to add the above mentioned code to our list view, default.php file.






According to the language strings that we have created in this step, we are adding these strings and their respective values to our en-GB.com_breed.ini config file.

Download Code

Next –> Starting to work on backend – Adding a view

Add a Comment

Your email address will not be published. Required fields are marked *


My name is Nohman Habib and I am a web developer with over 10 years of experience, programming in Joomla, Wordpress, WHMCS, vTiger and Hybrid Apps. My plan to start is to share my experience and expertise with others. Here my basic area of focus is to post tutorials primarily on Joomla development, HTML5, CSS3 and PHP.

Nohman Habib


Request a Quote