brandonballentine.com

I’ve noticed a few people in the EE forums have been experiencing some of the same problems I did when trying to build a real estate website that allowed for filtering by price and features. I thought I would offer up some sample code that worked for me. Please leave a comment if you have any questions or comments to add! Also, I can’t remember for sure, but I believe I had to change the values of the prices in the EE database from text to integer . . .

The Search Form

<h2>Search Listings Listings</h2>
<form method="post" action="{homepage}" onsubmit="this.action = '/' + this.elements.pricerange.value + '/' + this.elements.pricerange1.value;">
<p>
<select name="pricerange">
<option value="index.php/listings/results/0">Minimum Monthly Rent</option>
<option value="index.php/listings/results/500">$500 per month</option>
<option value="index.php/listings/results/700">$700 per month</option>
<option value="index.php/listings/results/900">$900 per month</option>
<option value="index.php/listings/results/1100">$1100 per month</option>
<option value="index.php/listings/results/1300">$1300 per month</option>
</select>
</p>
<p>
<select name="pricerange1">
<option value="9999">Maximum Monthly Rent</option>
<option value="500">$500 per month</option>
<option value="700">$700 per month</option>
<option value="900">$900 per month</option>
<option value="1100">$1100 per month</option>
<option value="1300">$1300 per month</option>
<option value="9999">$1301+ per month</option>
</select>
</p>
<p>
<select name="search:bedrooms">
<option value=""># of Bedrooms</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</p>
<p>
<select name="search:area">
<option value="">Area</option>
<option value="County 1">County 1</option>
<option value="County 2">County 2</option>
<option value="County 3">County 3</option>
<option value="County 4">County 4</option>
<option value="County 5">County 5</option>
</select>
</p>
<p>
<select name="search:subarea">
<option value="">Sub Area</option>
<option value="North">North</option>
<option value="South">South</option>
<option value="East">East</option>
<option value="West">West</option>
</select>
</p>
<p>
<select name="search:fencedyard">
<option value="">Fenced Yard</option>
<option value="Yes">Yes</option>
<option value="No">No</option>
</select>
</p>
<p>
<select name="search:petsallowed">
<option value="">Pets allowed?</option>
<option value="yes">Yes</option>
<option value="no">No</option>
</select>
</p>
<input type="submit" value="Go!" />

The first two drop-downs append the minimum and maximum price to the results URL (which is then grabbed using url_segment in the results page. The rest can be accessed via dynamic parameters on the search results page.

The results page

I’ve left out a lot of the template to just show the important stuff.

<h2>Current Listings</h2>
{exp:weblog:entries
weblog="listings"
disable="category_fields|member_data|pagination|trackbacks"
        dynamic_parameters="limit|search:petsallowed|search:fencedyard|search:bedrooms|search:area|search:subarea"}
<div class="entry-top">
<h3>{title}</h3>
<div class="listing-image grid_3 alpha">

<a href="http://www.examplesite.net{main-property-image}" title="{title}" class="prop-listing">{exp:imgsizer:size image="{main-property-image}" width="200" alt="{title}"}</a>

</div><!--end listing-image -->
<div class="listing-desc-summary grid_5 omega"><p><span>{short_decription} </span><br /><br /><b>{bedrooms}</b> bedrooms, <b>{fullbaths}</b> full bathrooms, <b>${monthlyrent}</b>/month. - <a href="{homepage}/listings/detail/{url_title}">View More Details</a></p>
</div><!-- end listing-desc-summary -->
</div><!-- end entry-top -->
<div class="clear">&nbsp;</div>
<hr>
{/exp:weblog:entries}