Displaying database contents from drop down selection - php

Question

In my website I have a page to display testimonials. I wrote this code to display my all testimonials from database.
This is my code so far :
while ( $row = mysqli_fetch_array( $r, MYSQLI_ASSOC)) {
$testimonial = $row['testimonial'];
//echo $testimonial;
$mytestimonial = nl2br($testimonial);
$city = $row['city_name'];
$name = $row['name'];
$url = $row['web_address'];
$imageName = $row['image_name'];
$type = $row['membership_type'];
}
With this code I can get all my testimonials to the page. Its pretty working for me. My problem is now I need to filter my testimonials according to its type. I have 3 different kind of testimonials in my database. (tutor, institute, student)
I am going to use a select box to filter the data. When selecting an option from select box I need to display testimonials according to that selected type.
<div class="filter-box">
<div id="select_box">
<form method="post" action="">
<div class="variation2">
<label>Filter By</label>
<select class="select">
<option>Tutor</option>
<option>Institute</option>
<option>Student</option>
</select>
</div>
</form>
</div>
</div>
Can anyone get me going in a direction here?
Thank You

Answer 1

Why not reload the select box dynamically (using AJAX) once the user has selected one of the 3 options and display your required testimonial.I guess that will solve your problem.

Answer 2

So you want to then select the testimonials based on their type
$q = "SELECT testimonial, city_name, name, web_address, image_name, membership_type
FROM testimonials
INNER JOIN city ON city.city_id = testimonials.city_id
WHERE type = '$type'
ORDER BY date_added DESC LIMIT $start, $display";
Now you also want to get the type from the user
<select name="type" class="select">
With the POST
$type = $_POST['type'];
Auto submit the form on change example
Javascript:
<script type="text/javascript">
function submitform(){
document.frmType.submit();
}
</script>
Form:
<form name="frmType" method="post" action="">
<select name="type" class="select" onchange="submitform()">
Further examples can be found here

Answer 3

You have a couple options. The first is with ajax.
Second is submitting the form onchange or onsubmit:
<select class="select" name="type" onchange="document.forms[0].submit();">
<option value="Tutor">Tutor</option>
<option value="Institute">Institute</option>
<option value="Student">Student</option>
</select>
And your query:
$type = '';
if(!empty($_POST) && isset($_POST[type])){
$type = " WHERE testimonials.type = '".$_POST[type]."'";
}
$q = "SELECT testimonial, city_name, name, web_address, image_name, membership_type
FROM testimonials
INNER JOIN city ON city.city_id = testimonials.city_id
".$type."
ORDER BY date_added DESC LIMIT $start, $display";
Of course make sure to check if the form was submitted.

Answer 4

add a class by the name to each of the testimonial divs
<div class="student">testimonial goes here</div>
now use jquery to hide/show the categories at one shot.
$('.student').show();
i hope it helps