Forum Moderators: coopster
I've created a drop down box so that users can filter the results of a price list based on the category. It seems to be working, however, when the page is first presented, there are no results listed, just the drop down box set to "All" by default and the table headers. When I click the Submit button, all of the records do appear. The records also appear correctly when I choose a category.
My question is this: How do I get the page to display all of the records when first presented?
I would also like to know if there is a way of creating this drop down box so that the user does not have to click on a Submit button. The records just change based on the selection.
My code is presented below.
Thank you in advance for your assistance.
______________________________________________
<body>
<div id="mainContainer_displayPage" class="clearfix">
<?php
include "---.php";
?>
<br /><br /><br /><br />
<div id="search_results">
<div class= "searchHeading">Search By Category:</div>
<form id="searchForm"action="display_prices_6_testDropDown.php" method="GET">
<select id="categoryName" name="categoryChoice" style="text-align:center;">
<option value="All" selected="selected" >All</option>
<option value="25">Begonias</option>
<option value="31">Butterfly Plants</option>
<option value="7">Cactus/Succulents</option>
<option value="29">Ferns</option>
<option value="27">Florida Natives</option>
<option value="3">Flowering Shrubs</option>
<option value="17">Flowering Trees</option>
<option value="28">Foliage Shrubs</option>
<option value="11">Fragrant Plants</option>
<option value="16">Fruit Trees</option>
<option value="10">Fruiting Plants</option>
<option value="5">Ground Cover</option>
<option value="13">Hanging Baskets</option>
<option value="2">Hedges</option>
<option value="30">Interior Plants</option>
<option value="13">New Releases</option>
<option value="9">Orn. Grasses</option>
<option value="22">Orn. Trees</option>
<option value="23">Palms</option>
<option value="19">Patio Trees</option>
<option value="6">Perennials</option>
<option value="32">Roses</option>
<option value="26">Seasonal</option>
<option value="8">Shade Plants</option>
<option value="21">Shade Trees</option>
<option value="20">Street Trees</option>
<option value="12">Tropicals/Exotics</option>
<option value="4">Vines</option>
</select>
<input class="submit_cat" type="submit" value="Show Plants">
</form>
<br>
</div><!--end search results-->
<table id="contactDisplayList">
<tr>
<th id="products_name" class="tableHeader">Plant Name</th>
<th id="products_common_name" class="tableHeader">Common Name</th>
<th id="products_common_name" class="tableHeader">Category:</th>
<th id="4_inch" class="tableHeader_cont">4 Inch</th>
<th id="4.5_inch" class="tableHeader_cont">4.5 Inch</th>
<th id="1_gal" class="tableHeader_cont">1 gal</th>
<th id="3_gal" class="tableHeader_cont">3 gal</th>
<th id="5_gal" class="tableHeader_cont">5 gal</th>
<th id="7_gal" class="tableHeader_cont">7 gal</th>
<th id="10_gal" class="tableHeader_cont">10 gal</th>
<th id="15_gal" class="tableHeader_cont">15 gal</th>
<th id="20_gal" class="tableHeader_cont">20 gal</th>
<th id="25_gal" class="tableHeader_cont">25 gal</th>
<th id="45_gal" class="tableHeader_cont">45 gal</th>
<th id="65_gal" class="tableHeader_cont">65 gal</th>
<th id="hb_8" class="tableHeader_cont">Hanging Basket, <br />8 inch</th>
<th id="hb_10" class="tableHeader_cont">Hanging Basket, <br />10 inch</th>
<th id="hb_12" class="tableHeader_cont">Hanging Basket, <br />12 inch</th>
</tr>
<?php
$query = "SELECT * FROM
zen_products p,
zen_products_description pd,
zen_products_price pr,
zen_categories_description cd
WHERE p.products_id = pd.products_id AND
p.master_categories_id = cd.categories_id AND
p.products_id = pr.products_id";
if ($categoryChoice !="All")
$query .= " AND p.master_categories_id = '{$categoryChoice}'";
$query .= " order by products_name";
$result = mysql_query($query)
or die ("Couldn't execute query.");
while ($row = mysql_fetch_array($result))
{
extract($row);
?>
<?php
print
'<tr class="rowHeight">
<td class ="leftAlign">'. $row['products_name'] . '</td>
<td class ="leftAlign">' . $row['products_common_name'] . '</td>
<td class ="leftAlign">' . $row['categories_name'] . '</td>
<td class ="centerAlign">' . formatPrice($price_4_inch) . '</td>
<td class ="centerAlign">' . formatPrice($price_4_5_inch) . '</td>
<td class ="centerAlign">' . formatPrice($price_1_gal) . '</td>
<td class ="centerAlign">' . formatPrice($price_3_gal) . '</td>
<td class ="centerAlign">' . formatPrice($price_5_gal) . '</td>
<td class ="centerAlign">' . formatPrice($price_7_gal) . '</td>
<td class ="centerAlign">' . formatPrice($price_10_gal) . '</td>
<td class ="centerAlign">' . formatPrice($price_15_gal) . '</td>
<td class ="centerAlign">' . formatPrice($price_20_gal) . '</td>
<td class ="centerAlign">' . formatPrice($price_25_gal) . '</td>
<td class ="centerAlign">' . formatPrice($price_45_gal) . '</td>
<td class ="centerAlign">' . formatPrice($price_65_gal) .'</td>
<td class ="centerAlign">' . formatPrice($price_hb_8) . '</td>
<td class ="centerAlign">' . formatPrice($price_hb_10) . '</td>
<td class ="centerAlign">' . formatPrice($price_hb_12) . '</td>
</tr>';
}
function formatPrice($price) {
$fnl = ($price>0)?'$' . sprintf("%.2f",$price):'*';
return $fnl;
}
?>
</table>
</div>
<!--end main container-->
</body>
[edited by: eelixduppy at 8:41 pm (utc) on Sep. 22, 2009]
[edit reason] no URLs, please [/edit]
Try using this logic test instead of your current one:
if (isset($_GET['categoryChoice']) && $_GET['categoryChoice'] != "All")
$query .= " AND p.master_categories_id = '".mysql_real_escape_string($_GET['categoryChoice'])."'";
Thank you. I changed my script as you suggested to correct the security issue.
I also changed the link that leads to this page adding ?categoryChoice=All to the end of it. That ensured that the page opens up by listing all the products.
Is there a way to create a select box like this that doesn't use a submit button, that just changes the results when a different category is selected?
<select id="categoryName" name="categoryChoice" style="text-align:center;" [b]onchange="this.form.submit();"[/b]>
One way to provide the submit is with the <noscript> tag right after the closing of the </select>:
</select><noscript> <input type="submit" value="Go!" /></noscript>
