简体   繁体   中英

Matching SQL columns and parsing them into another SQL table

I have an SQL table that contains a column named 'Make' and one named 'Model'. Each row has its own 'Make' and 'Model'.

I currently have two select elements on my web page; one is for the 'Make' and one is for the 'Model'.

I then have a list that displays all of the Makes and Models in the SQL database, using PDO and a while loop to display everyone.

I have managed to filter the list on the page using this simple jQuery code:

<script>
    $(document).ready(function(){
  $('.form-control').change(function(){
    var make = $(this).val();
    if(make != 'make-any'){
      $('.makes').hide();
      $('.'+make).show();
      } else {
        $('.makes').show();
        }
    });
  });</script>

Basically if a user selects one of the options it will hide all of the li's that don't have the same class as the option value that has been selected.

So now you basically understand what I am trying to achieve I am now left with something a little more tricky.

I am now trying to associate Makes with Models so I'm not left with a select element with options that don't apply to certain Makes for example... if a user selects BMW I don't want Models displaying that are not a BMW in the 'Model' select element options such as a Mustang.

I am aware I will have to use AJAX for this function however I first need a way to format my Makes and Models.

Here is the basic plan, I want to create a new table in my database, this table will have columns named after the Makes so for example:

Audi, BMW, Chevrolet etc...

In these columns I will have each row as a Model so the column will be built like this:

Audi
A1
A2
A3

So I am now left with the problem of taking the data from the first SQL table and inserting each column as a Make from the 'Make' column. I then need to be able to insert all of the Models that are associated with each Make into each of the 'Make' columns.

I will then be able to make an AJAX call for a certain column to display the right models.

Any ideas how I might be able to do the SQL table process?

I would choose this database structure:

CREATE TABLE make (
    id INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
    name varchar(50) NOT NULL
);

CREATE TABLE model (
    id INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
    name varchar(50) NOT NULL
);

CREATE TABLE make_model (
    id INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
    make_id INT NOT NULL,
    model_id INT NOT NULL
);

INSERT INTO make(name) VALUES ('Audi'), ('BMW'), ('Chevrolet');
INSERT INTO model(name) VALUES ('A1'),('A2'),('A3'),('B1'),('B2'),('C1');
INSERT INTO make_model(make_id, model_id) VALUES (1, 1), (1, 2), (1, 3), (2, 4), (2, 5), (3, 6);

A PHP script to return related models in JSON format:

getmodels.php

<?PHP
require "dbconfig.php";

if(isset($_GET['make']) && intval($_GET['make']) > 0){
    $SQL = "SELECT model.id, model.name FROM model, make_model WHERE model.id = make_model.model_id AND make_model.make_id=".$_GET['make'];
} else {
    $SQL = "SELECT id, name FROM model";
}

$data = json_encode($db->query($SQL)->fetchAll(PDO::FETCH_ASSOC));
header("Content-Type: application/json");
echo $data;
?>

A make-model listing page like this

<?PHP
require "dbconfig.php";
function list_options($tbl){
    global $db;
    $res = $db->query("SELECT * FROM $tbl");
    while($row = $res->fetch(PDO::FETCH_ASSOC)){
        echo '<option value="'.$row['id'].'">'.$row['name'].'</option>';
    }   
}
?>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Some form</title>
</head>
<body>
<form>
    <select id="make">
     <option value="0">All</option>
    <?PHP list_options("make"); ?>
    </select>
    <select id="model">
    <?PHP list_options("model"); ?>
    </select>
</form>
<script type="text/javascript" src="//code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript">
$(function(){
    $('#make').on('change', function(){
            $("#model").empty();
      $.getJSON("getmodels.php?make=" + this.selectedIndex, function(result){
        $.each(result, function(i, row){
            $("#model").append('<option value="'+row['id']+ '">'+row['name']+'</option>');
        });
      });
    });
});
</script>
</body>
</html>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM