11496 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

je rencontre un problème, je ne vois pas où ça coince.
j'essaie de faire une première liste déroulante qui va me filtrer ma liste déroulante 2
mes 2 tables:
sites : IDSite, Nom, IDClient
systemes : IDSysteme, Designation, IDSite

Voici le code que j'ai réalisé mais qui ne fonctionne pas (débutant ajax)
form.php
<body>
    <div id="container">
        <div id="header">
            <h1><a href="index.php"><img src="images/capecom.png" alt="logo capecom" /></a></h1>
            <h2>Support technique</h2>
        </div>

        <div id="content">
            
            <?php
            if($_POST['login'] != '' and $_POST['password'] != '')
            {
                //je verifie que j'ai la paire login+mdp

                $sql ="SELECT * FROM utilisateurs";
                $res = $cnx->query($sql);
                $row = $res->fetch(PDO::FETCH_ASSOC);
                if (($row['Login'] == $_POST['login']) AND ($row['Password'] == $_POST['password']))
                {
                    $log  = mysql_real_escape_string(htmlspecialchars($_POST['login']));
                    $sql1 = $cnx->query('SELECT IDClient FROM utilisateurs WHERE Login ="'. addslashes($log) .'"') or die(mysql_error());
                    $row1 = $sql1->fetch(PDO::FETCH_ASSOC);
                    
                   //j'affiche le formulaire
                    ?>
                    <form action="process.php" method="post" name="form_ticket">
                        <fieldset><legend class="legende">Contacter le support</legend>
                            <label for="nom" class="libele">Nom</label>
                            <input type="text" name="nom" id="nom" size="30" /><br>
                            <label for="sites" class="libele">Site</label>
                            <select name="sites" id="sites" onChange="Systeme(this.value);" size="1">
                                <option value='-1' selected>Sélectionner un site...</option><?php
                                $sql = $cnx->query('SELECT * FROM sites WHERE IDClient="'. addslashes($row1['IDClient']).'"') or die(mysql_error());
                                while($row = $sql->fetch())
                                {
                                    echo '<option value="'.$row['IDSite'].'"';'>'.$row['Nom'].'</option>';
                                   
                                } ?>
                            </select><br>
                            <label for="systeme" class="libele">Systèmes :</label>
                            <div id="systeme">
                                <?php
                                if(isset($_POST['site']))
                                {
                                    $include = 1;
                                    include('traitement.php');
                                }
                                ?>
                            </div><br>
                            <input type="submit" name="Valider" value="Valider"/>
                            <input type="reset" name="Effacer" value="Effacer"/>
                        </fieldset>
                    </form>
                    <?php
                }else {
                    echo "Les informations sont incorrect ! <a href=\"index.php\">Retour</a>";
                }
            }else {
                echo "Tous les champs ne sont pas renseigné ! <a href=\"index.php\">Retour</a>";
            }
            ?>
        </div>
        <div id="footer">
            
        </div>
    </div>

    
</body>


fonctions.js
//fonction d'instance
function objet_XMLHttpRequest()
{
	var xhr = null;
	if (window.objet_XMLHttpRequest || window.ActiveXOblect)
	{
		if(window.ActiveXOblect)
		{
			try {
				xhr = new ActiveXOblect("Msxml2.XMLHTTP");
			} catch(e) {
				xhr = new ActiveXOblect("Microsoft.XMLHTTP");
			}
		}else {
			xhr = new XMLHttpRequest();
		}
	}else {
		aler("Votre navigateur ne supporte pas l'objet XMLHttpRequest...");
		return null;
	}
	return xhr;
}

//fonction permettant d'envoyer les données
function Systeme(id)
{
	//On déclare un objet
    var objet1 = objet_XMLHttpRequest();
 
    //On défini ce qu'on va faire quand on aura la réponse
    objet1.onreadystatechange = function(){
        //On ne fait quelque chose que si on a tout reçu et que le serveur est ok
        if(objet1.readyState == 4 && objet1.status == 200){
            //On envoie la réponse dans le div "systeme"
            document.getElementById('systeme').innerHTML = objet1.responseText;
        }
        //côté ajax ça merde
        else{
            //on contrôle le statut. Si 404, le fichier ouvert par "open" n'existe pas
            if(objet1.status == 404){
                alert('Erreur ' +objet1.status + '! Le fichier php semble être absent...');
            }
        }
    }
    //Ouverture : méthode, fichier, mode (true=asynchrone | false=synchrone)
    objet1.open("POST", "traitement.php" , true);
    objet1.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    //envoie
    objet1.send("sites=" + id);
}


traitement.php
<?php
//systeme
if(isset($_POST["sites"]) && $_POST["sites"] != 'vide'){
/*Si la variable $include n'existe pas c'est que le numéro de la région passe par AJAX. On a donc besoin d'avoir une connexion avec la base de données.*/
/*Quand on poste le formulaire, cette page est inclue directement dans le div "blocDepartements", donc la connexion est inutile.*/
/*Si on inlcue cette page au moment de la validation, c'est uniquement pour garder la sélection "selected" de la liste.*/
if(!isset($include)){
//On indique le Content-Type utilisé
header('Content-Type: text/html; charset="iso-8859-1"');
 
//Variable de connexion BDD
$nom_du_serveur ="localhost";
$nom_de_la_base ="gestion_tickets";
$nom_utilisateur ="root";
$passe ="";
 
//Connexion à la base de données
mysql_connect("$nom_du_serveur","$nom_utilisateur","$passe");
//Vérification d'accès à la base de données
mysql_select_db("$nom_de_la_base") or die ('Erreur :'.mysql_error());
echo '<div id="reponse">La variable $_POST["sites"] provient d\'AJAX.</div>';
}
else{
echo '<div id="reponse">La variable $_POST["sites"] provient de l\'include.</div>';
}
?>
 
<label>Système : </label>
<select name="systeme" id="systeme">
<option value="vide">- - - Choisissez un systeme - - -</option>
<?php
//On sélectionne le systeme en fonction du site
$selectsysteme = mysql_query("SELECT * FROM systemes WHERE IDSite=".mysql_real_escape_string($_POST["sites"])." ORDER BY nom") or die (mysql_error());
//On boucle
while($donnees = mysql_fetch_assoc($selectsysteme))
{
echo '<option value="'.$donnees['IDSysteme'].'"';
if(isset($_POST["systeme"]) && $_POST["systeme"]==$donnees['IDSysteme']){ echo " selected"; }
echo '>'.$donnees['Designation'].'</option>';
}
?>
</select><br/>
<?php } ?>