Comment créer des listes déroulantes dépendantes dynamiques à l'aide de jQuery, AJAX, PHP et MySQL ?

Liste déroulante dynamique avec jQuery/AJAX et PHP/MySQL

Problème :

Construire un ensemble de listes déroulantes dynamiques utilisant jQuery/AJAX et PHP/MySQL où se trouve la deuxième liste déroulante les options dépendent de la sélection dans la première liste déroulante.

Requête JSON :

La requête JSON fournie pour générer les valeurs de la deuxième liste déroulante fonctionne correctement. Cependant, des problèmes surviennent lors du remplissage des options dans l'élément de formulaire déroulant.

Javascript :

L'erreur principale réside dans le gestionnaire d'événements de la première liste déroulante. Le code modifié doit ressembler à :

$().ready(function () {
    $("#item_1").change(function () {
        var group_id = $(this).val();

        $.ajax({
            type: "POST",
            url: "../../db/groups.php?item_1_id=" + group_id,
            dataType: "json",
            success: function (data) {
                // Clear previous options
                $('select#item_2').empty();
                $('select#item_2').append('<option value="0">Select Option</option>');

                // Populate options from JSON
                $.each(data.subjects, function (i, val) {
                    $('select#item_2').append('<option value="' + val.id + '">' + val.name + '</option>');
                });

                $('select#item_2').focus();
            },
            beforeSend: function () {
                $('select#item_2').empty();
                $('select#item_2').append('<option value="0">Loading...</option>');
            },
            error: function () {
                $('select#item_2').attr('disabled', true);
                $('select#item_2').empty();
                $('select#item_2').append('<option value="0">No Options</option>');
            }
        });
    });
});

HTML :

Le code HTML fourni semble correct.

PHP :

Le code PHP pour récupérer les données JSON est également correct.

Exemple de sortie JSON :

L'exemple de sortie JSON fourni est valide et sera analysé correctement par le code jQuery.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!