Adding More Options to the PHP/JScript

**Kage Kazumi** · 10-12-2012, 06:23 PM

Someone posted some HTML/Jscript and a PHP coding to help me with doing the following:

I'm creating a web page that will have software information on: basic description, operating system, free/commercial, etc. All the content will be placed (or generated) on one page. Dropdown filters at the top of the content will allow someone to select a "filter" (i.e. Windows) and it will auto remove all content (software) that doesn't work on Mac or Linux.

They gave me a place to start, but I am not familiar with writing PHP or jscript (Jquery).

Here is what it does: see here

Which is great it's a starting point, but how would I go about doing the following:

I have three dropdowns that I need:

Operating System Options: Windows, Mac, & Linux
Type: 2D, 3D, and 2d & 3D
Free/Commercial: Free, Commercial, Free & Commercial
Reset

The reset button will reset the filters.

Any help is appreciated.

THE CODE

index.html

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Gallery Exg</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<label for="filterBox">Box1</label>
<select name="filterBox" id="filterBox">
<option value="">- Select -</option>
<option value="Windows">Windows</option>
<option value="Linux">Linux</option>
</select><br />
<div class="filterResults">
<h1>Windows</h1>
<h1>Linux</h1>
</div>
<script type="text/javascript">
$(function(){
    $('#filterBox').change(function(){
        var Value=$(this).val();
        $.post('filter.php', {selectedValue: Value}, function(data) {
            if(data) $('.filterResults').html(data);
            else location.reload();
        });
    });
});
</script>
</body>
</html>

filter.php

Code:

<?php
if($_REQUEST['selectedValue']) {
    //here print the datas from database related to the selected value
    echo '<h1>'.$_REQUEST['selectedValue'].'</h1>';   
}
?>

vRespectfully,
Kage