AJAX Button: Male vs Female - Need 3rd choice (both)

Question

I'm learning how to work with AJAX and have a script from a tutorial that displays people's names stored in a database table. The database table includes a field named Gender. There are two possible values - M and F.

The page then displays a button that you can toggle between M and F, displaying only men or women.

Sex: <select id='Gender'>
<option value="M">M</option>
<option value="F">F</option>
</select>
<input type='button' onclick='ajaxFunction()' 
value='Query MySQL'/>
</form>

Is there a way to modify this so I can offer a third choice - display EVERYONE? I was playing with this idea, but I couldn't figure out how to make "M and F" an option value.

Sex: <select id='Gender'>
<option value="M">M</option>
<option value="F">F</option>
<option value="M and F">All</option>
</select>
<input type='button' onclick='ajaxFunction()' 
value='Query MySQL'/>
</form>

I'm working with PHP and MySQL.

Here's the code for the first page:

<html>
<body>
<script language="javascript" type="text/javascript">
<!-- 
//Browser Support Code
function ajaxFunction(){
var ajaxRequest;  // The variable that makes Ajax possible!

try{
  // Opera 8.0+, Firefox, Safari
 ajaxRequest = new XMLHttpRequest();
}catch (e){
// Internet Explorer Browsers
 try{
   ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
 }catch (e) {
   try{
      ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
    }catch (e){
      // Something went wrong
      alert("Your browser broke!");
      return false;
     }
  }
}

ajaxRequest.onreadystatechange = function(){
 if(ajaxRequest.readyState == 4){
    var ajaxDisplay = document.getElementById('ajaxDiv');
    ajaxDisplay.innerHTML = ajaxRequest.responseText;
   }
 }
var Gender = document.getElementById('Gender').value;
var Birth_Year = document.getElementById('Birth_Year').value;
var Died = document.getElementById('Died').value;
var queryString = "?Birth_Year=" + Birth_Year ;
queryString +=  "&Died=" + Died + "&Gender=" + Gender;
ajaxRequest.open("GET", "AjaxPeople2.php" + 
                          queryString, true);
ajaxRequest.send(null); 
}
//-->
</script>
<form name='myForm'>
Born Before: <input type='text' id='Birth_Year'> <br>
Died Before: <input type='text' id='Died'>
<br>
Sex: <select id='Gender'>
<option value="M">M</option>
<option value="F">F</option>
<option value="M_F">All</option>
</select>
<input type='button' onclick='ajaxFunction()' 
value='Query MySQL'/>

<input type="radio" name="Men" value="M">M<br>
<input type="radio" name="Women" value="F">F<br>
<input type="radio" name="All" value="M_F">All<br>

</form>
<div id='ajaxDiv'>Your result will display here</div>
</body>
</html>

And the code for the second page...

$dsn = "mysql:host=localhost;dbname=db_new;charset=utf8";
$opt = array(
 PDO::ATTR_ERRMODE            => PDO::ERRMODE_EXCEPTION,
 PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC
);

$pdo = new PDO($dsn,'(Username)','(Password)', $opt);

// Retrieve data from Query String
$Common = $_GET['Common'];
$Birth_Year = $_GET['Birth_Year'];
$Died = $_GET['Died'];
$Gender = $_GET['Gender'];
$Birth_ID = $_GET['Birth_ID'];
$Death_ID = $_GET['Death_ID'];

$sql= "SELECT * FROM people_bios PB
 LEFT JOIN people P ON P.URL = PB.URL
 WHERE Gender = :Gender AND Site = 'PX'";
 if(is_numeric($Birth_Year)) {
 $sql .= " AND Birth_Year <= :Birth_Year";
}
if(is_numeric($Died)) {
$sql .= " AND Died <= :Died";
}
$stmt = $pdo->prepare($sql);
$stmt->bindParam(':Gender',$Gender,PDO::PARAM_STR);
if (is_numeric($Birth_Year)) {
 $stmt->bindParam(':Birth_Year', $Birth_Year, PDO::PARAM_INT);
}
if(is_numeric($Died)) {
 $stmt->bindParam(':Died', $Died, PDO::PARAM_INT);
}
$stmt->execute();

//Execute query
  try {
  $stmt->execute();
 } catch (Exception $e) {
 // print_r($e); // Do something more useful here, like log.
}

//Build Result String
$display_string = "<table>";
$display_string .= "<tr>";
$display_string .= "<th>Name</th>";
$display_string .= "<th>Born</th>";
$display_string .= "<th>Died</th>";
$display_string .= "<th>Birth Place</th>";
$display_string .= "<th>Death Place</th>";
$display_string .= "</tr>";

// Insert a new row in the table for each person returned
while ($row = $stmt->fetch())
{
 $display_string .= "<tr>";
 $display_string .= "<td>$row[Common]</td>";
 $display_string .= "<td>$row[Birth_Year]</td>";
 $display_string .= "<td>$row[Died]</td>";
 $display_string .= "<td>$row[Birth_ID]</td>";
 $display_string .= "<td>$row[Death_ID]</td>";
 $display_string .= "</tr>";    
}

echo "Query: " . $query . "<br />";
$display_string .= "</table>";
echo $display_string;

Answer 1

"M_F" or nothing or anything , give u some ref

$where_gender = preg_match('{^[MF]$}',$Gender)? 'AND Gender = :Gender' : '';


$sql= "SELECT * FROM people_bios PB
 LEFT JOIN people P ON P.URL = PB.URL
 WHERE  Site = 'PX' {$where_gender}";

 ...


if ($where_gender) {
    $stmt->bindParam(':Gender',$Gender,PDO::PARAM_STR);
}

AJAX Button: Male vs Female - Need 3rd choice (both)

Question

1 answers

solution1
1 ACCPTED 2014-01-21 01:05:02

AJAX Button: Male vs Female - Need 3rd choice (both)

Question

1 answers

solution1 1 ACCPTED 2014-01-21 01:05:02

solution1
1 ACCPTED 2014-01-21 01:05:02