Problème changement variable

Salut,

Tu fais un appel Ajax pour intéroger ta base de données pour savoir combien il y a d'élève, et quand ton retour ajax est là, tu changes le text de l'élément.

$('#nombre_eleve').text('\<nouveau nombre>');

Merci de ta réponse rapide !
Bon j'ai essayé de bidouiller un truc, ça marche à peu près sauf à un détail près, par moment, je vais ajouter un élève, et ça va changer le numéro, et par moment, je vais ajouter l'élève, mais le changement va se faire si je rajoute encore un autre élève, donc ca va mettre le bon numéro du rowCount au bout du 3ème ajout quoi.... ça peut venir de quoi ce bug ?

Voici le JS corrigé, ainsi que ma nouvelle page nombre_eleve.php

$("#submit").click(function (e) {

e.preventDefault();

var liste_nom= $("#liste_nom").val();

    if(liste_nom) {

        $.ajax({
            type: "POST",
            url: "action.php",
            data:
            {
                liste_nom:liste_nom
            },
            success: function(response) {
                document.getElementById("all_eleve").innerHTML=response+document.getElementById("all_eleve").innerHTML;
            }
        });

        $.ajax({
            type: "POST",
            url: "nombre_eleve.php",
            data:
            {
                liste_nom:liste_nom
            },
            success: function(data) {
                $("#nombre_eleve").html(data);
            }
        });
    }
});

<?php
include "../inc/db.php";

if(isset($_POST['liste_nom'])) {

$liste_nom = $_POST['liste_nom'];

$req_nombre_eleve = $bdd->query("SELECT * FROM eleve");
$nombre_eleve = $req_nombre_eleve->rowCount();

  if($req_nombre_eleve) {
     echo "".$nombre_eleve."";
  }

}

?>

Aucune idée, met un errorHandler sur ton ajax pour voir si tu as des erreurs retournées.

$.ajax({
    type: "POST",
    url: "nombre_eleve.php",
    data: {
        liste_nom: liste_nom
    },
    success: function (data) {
        $("#nombre_eleve").text(data);
    },
    error: function (error) {
        console.log(error);
    }
});

J'ai essayé mais il n'y pas d'erreurs :/

Bonjour.
Il y a plusieurs choses qui ne vont pas dans ton code, autant niveau PHP que JavaScript.

$req = $bdd->query("SELECT * FROM eleve");
$reponse = $req->fetchAll();

$req_nombre = $bdd->query("SELECT * FROM eleve");
$nombre_eleve = $req_nombre->rowCount();

Pourquoi faire deux requêtes au lieu d'une, alors que c'est la même requêtes, sauf le type de retour qui est différent ?
Il te suffit de faire :

$req = $bdd->query("SELECT * FROM eleve");
$reponse = $req->fetchAll();
$nombre_eleve = $req->rowCount();

Ensuite :

if($req_nombre_eleve) {

Cette condition est totalement inutile, car elle ne contient aucun résultat, mais juste un object de type PDOStatement, il vaut donc mieux que tu fasses la condition sur la variable qui contient le résultat de la méthode rowCount de la requête.
Au niveau JavaScript, pourquoi est-ce que tu utilises la méthode html lorsque tu récupères le nombre d'utilisateurs alors que ton retour est une simple chaîne de caractères ?
Alors que comme te l'avais donné en exemple Balsakup dans une de ses réponses, il te montrait la méthode text.

Bonjour et merci de tes conseils... j'ai bien changé tout ça, mais malheureusement toujours le même problème :/

j'ai bien changé tout ça, mais malheureusement toujours le même problème :/

C'est peut-être tout simplement que tu n'as pas encore eu le retour de ton script PHP, il ne faut pas oublier que lorsque un nom est ajouté via le formulaire tu fais deux requêtes HTTP, l'une à la page action.php et l'autre à la page __nombre_eleve.php__.
Tu devrais donc faire un indicatif pour éviter que l'utilisateur soumette le formulaire à plusieurs reprises consécutivement tant que tu n'as pas eu le retour de la dernière requête.
Par exemple :

$("#submit").click(function (e) {
    e.preventDefault();
    var $submit = $(this);
    $submit.attr('disabled', true);
    // 1ère requête HTTP ...
    // 2ème requête HTTP
    $.ajax({
        type: "POST",
        url: "nombre_eleve.php",
        data:
        {
            liste_nom: liste_nom
        },
        success: function(data) {
            $("#nombre_eleve").text(data);
            $submit.removeAttr('disabled');
        },
        error: function (error) {
            console.log(error);
        }
    });    
}

De cette manière, lorsque l'utilisateur soumet le formulaire, il devra attendre que tu ait eu le retour de la dernière requête HTTP et que tu aies fait le nécessaire, avant de pouvoir soumettre à nouveau le formulaire.
Il ne faut pas oublier que tu fais quand même trois requêtes SQL (1 INSERT et 2 SELECT) entre chaque soumission du formulaire.
Par contre, je ne comprends pas pourquoi tu fais une requête de type POST pour la seconde, alors que concrétivement tu ne te sert même pas des données que tu envois.
Je crois surtout que tu as copié/collé la première requête par flemme, et que tu n'as principalement changé que l'url.