Jump to content
MakeWebGames

AJAX help

Shades

By Shades
in Web Developement

 Share

Recommended Posts

Shades Newbie

Shades

Posted
Posted

Hello, from the help of @Magictallguy. THANK YOU!I have finally created two drop down lists which show the make and model of the vehicles from the database. However, know when I choose the make on the first drop down list I want it dynamically to show the second drop down list only specific for the make which has been chosen! However, I seem to be getting this wrong. If someone could help me out here would be appreciated

search.php - 

	<!DOCTYPE HTML>
<head>
    <title>Car Search</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script>
$(document).ready(function(){
    $('#cmMAKE').on('change', function(){
        var cmMAKE = $(this).val();
        if(cmMAKE){
            $.ajax({
                type:'POST',
                url:'searchAjax.php',
                data:'cmMAKE='+cmMAKE,
                success:function(html){
                    $('#cmMAKE').html(html);
                    $('#cmMODEL').html('<option value="">Select make first</option>'); 
                }
            }); 
        }else{
            $('#cmMAKE').html('<option value="">Select make first</option>');
            $('#cmMODEL').html('<option value="">Select model first</option>'); 
        }
    });
    
</script>
</head>
	<?php
error_reporting(E_ALL & ~E_NOTICE);
require("config/config.php");
    
try {
	    $database = new Connection();
    $db = $database->openConnection();
    $q = $db->prepare("SELECT COUNT(`avail`.`cID`) AS `total`, `make`.`cmMAKE`
                        FROM `cars_available` AS `avail`
                        INNER JOIN `car_makes` AS `make` ON `avail`.`cMAKE` = `make`.`cmID`
                        GROUP BY `avail`.`cMAKE`
                        ORDER BY `total` DESC, `make`.`cmMAKE` ASC");
    $q->execute();
    $data = $q->fetchAll();    
	    ?>
	    <table width = "50%">
    <tr>    
    <th><h3>SEARCH OUR CARS</h3></th>
    <th><h4>Make:</h4></th>
    <!--     <form name="searchcars" method="POST" action="searchsubmit.php"> -->
    <th>    
    <select name="cmMAKE" id="cmMAKE">
        <option value="">MAKE</option>
        <?php foreach ($data as $row): ?>
              <option><?=$row["cmMAKE"]?> (<?=$row["total"]?>)</option>
                <?php endforeach ?>
    </select>
    </th>
	    <?php 
	    $q2 = $db->prepare("SELECT COUNT(`avail`.`cMODEL`) AS `total`, `model`.`cmoMODEL`
                        FROM `cars_available` AS `avail`
                        INNER JOIN `car_models` AS `model` ON `avail`.`cMODEL` = `model`.`cmoID`
                        GROUP BY `avail`.`cMODEL`
                        ORDER BY `total` DESC, `model`.`cmoMODEL` ASC");
    $q2->execute();
    $data2 = $q2->fetchAll();    
	    ?>
    <th><h4>Model:</h4></th>
    <th>
        <select name="cmoMODEL" id="cmoMODEL">
        <option value="">MODEL</option>
        <?php foreach ($data2 as $row2): ?>
              <option><?=$row2["cmoMODEL"]?> (<?=$row2["total"]?>)</option>
                <?php endforeach ?>
    </select>
    </th>
    <th><input type="submit" value="Submit"></th>
    </form>
     </tr>
    <table>
	<?php 
	    $database->closeConnection();
}
catch (PDOException $e) {
    echo "There is some problem in connection: " . $e->getMessage();
}
?>
</html>

searchAjax.php - 

	<?php
error_reporting(E_ALL & ~E_NOTICE);
require("config/config.php");
	$cmMAKE = $_POST["cmMAKE"];
	try {
	    $database = new Connection();
    $db = $database->openConnection();
    
	if(!empty($_POST["cmMAKE"])) { 
    // Fetch model data based on the specific make
    $q2 = $db->prepare("SELECT COUNT(`avail`.`cMODEL`) AS `total`, `model`.`cmoMODEL`
                        FROM `cars_available` AS `avail`
                        INNER JOIN `car_models` AS `model` ON `avail`.`cMODEL` = :cmMAKE
                        GROUP BY `avail`.`cMODEL`
                        ORDER BY `total` DESC, `model`.`cmoMODEL` ASC");
    $q2->bindParam(":cmMAKE", $cmMAKE);
    $q2->execute();
    $data2 = $q2->fetchAll();
	
?>
	
    //$query = "SELECT * FROM states WHERE country_id = ".$_POST['country_id']." AND status = 1 ORDER BY state_name ASC"; 
    //$result = $db->query($query); >
	    // Generate HTML of state options list 
	     <?php foreach ($data as $row): ?>
              <option><?=$data2["cmoMODEL"]?> (<?=$row["total"]?>)</option>
                <?php endforeach ?>
                <?
}
$database->closeConnection();
}
catch (PDOException $e) {
    echo "There is some problem in connection: " . $e->getMessage();
}
?>

  • Like 1
Link to comment
Share on other sites
Djkanna Rookie

Djkanna

Posted
Posted
On 7/28/2019 at 1:45 AM, Shades said:

WOW! You legend! You made it look so easy man thanks for that I appreciate that man 

No problem, if you genuinely have an issue implementing it into your code shoot me a message I'll try and lend a hand. (I'm not active all the time - but I check in every now and again)

  • Like 2
Link to comment
Share on other sites
  • 3 weeks later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...