Odo 1

To store odontogram data in SQL and retrieve it to display the same odontogram again, you can follow these steps:

1. Define the Database Schema: Create a table to store the odontogram data for each tooth. This table should include columns for the tooth number, condition (decayed, missing, etc.), and any specific classifications like class type of decay.

2. PHP Script to Insert Data: Create a PHP script to handle the data submission from your form and insert it into the database.

3. PHP Script to Retrieve Data: Create another PHP script to retrieve the data from the database and populate the odontogram.

Here is an example implementation:

Database Schema

CREATE TABLE odontogram (
    id INT AUTO_INCREMENT PRIMARY KEY,
    tooth_number INT NOT NULL,
    condition ENUM('decayed', 'missing', 'stains', 'none') NOT NULL,
    decay_classification VARCHAR(50),
    missing_classification VARCHAR(50),
    UNIQUE(tooth_number)
);

PHP Script to Insert Data (submit_odontogram.php)

<?php
$servername = "localhost";
$username = "username";
$password = "password";
$dbname = "dbname";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);

// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}

// Collect POST data
$toothConditions = [
    'decayed' => explode(',', $_POST['decayed']),
    'missing' => explode(',', $_POST['missing']),
    'stains' => explode(',', $_POST['stains']),
    'none' => explode(',', $_POST['none']),
];

foreach ($toothConditions as $condition => $teeth) {
    foreach ($teeth as $tooth) {
        $tooth = intval($tooth);
        if ($tooth > 0) {
            $sql = "INSERT INTO odontogram (tooth_number, condition) VALUES ($tooth, '$condition')
                    ON DUPLICATE KEY UPDATE condition='$condition'";
            if (!$conn->query($sql)) {
                echo "Error: " . $sql . "<br>" . $conn->error;
            }
        }
    }
}

$conn->close();
?>

PHP Script to Retrieve Data (retrieve_odontogram.php)

<?php
$servername = "localhost";
$username = "username";
$password = "password";
$dbname = "dbname";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);

// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}

$sql = "SELECT tooth_number, condition FROM odontogram";
$result = $conn->query($sql);

$toothConditions = [
    'decayed' => [],
    'missing' => [],
    'stains' => [],
    'none' => []
];

if ($result->num_rows > 0) {
    while($row = $result->fetch_assoc()) {
        $toothConditions[$row['condition']][] = $row['tooth_number'];
    }
}

$conn->close();

// Return data as JSON
header('Content-Type: application/json');
echo json_encode($toothConditions);
?>

Modifications to HTML and JavaScript

HTML (Add action and method attributes to form and update submit-button handler):

<form id="odontogram-form" action="submit_odontogram.php" method="post">
    <!-- Your existing HTML code -->
    <button id="submit-button" type="submit">Submit</button>
</form>

JavaScript (Update the AJAX request in the submit-button handler):

$('#submit-button').on('click', function(e) {
    e.preventDefault();
    $.ajax({
        url: $('#odontogram-form').attr('action'),
        type: $('#odontogram-form').attr('method'),
        data: {
            decayed: toothConditions.decayed.join(','),
            missing: toothConditions.missing.join(','),
            stains: toothConditions.stains.join(','),
            none: toothConditions.none.join(',')
        },
        success: function(response) {
            console.log('Summary updated:', response);
        },
        error: function(xhr, status, error) {
            console.error('Error updating summary:', error);
        }
    });
});

JavaScript (Add code to populate the odontogram based on retrieved data):

$(document).ready(function() {
    // Existing code...

    // Fetch existing odontogram data
    $.ajax({
        url: 'retrieve_odontogram.php',
        type: 'GET',
        success: function(response) {
            for (const [condition, teeth] of Object.entries(response)) {
                teeth.forEach(tooth => {
                    updateState('.tooth-' + tooth + '-parent', tooth, condition);
                    $('.input-box[data-tooth="' + tooth + '"]').val(condition);
                });
            }
        },
        error: function(xhr, status, error) {
            console.error('Error retrieving odontogram data:', error);
        }
    });
});

This setup allows you to store the odontogram data in an SQL database through PHP, and retrieve it to display the odontogram again. The submit_odontogram.php script handles data insertion, while the retrieve_odontogram.php script retrieves the stored data to populate the odontogram.