[RESOLU] ntification en temps réel

28 juil. 2016, 10:55

bonjour,
voilà je voudrais faire un système de notification de ticket d'incident en temps réel pour ma ptite gescom.
ma requete se fait bien à condition d'actualiser la page.
j'ai rajouté du js pour éviter l'actualisation mais ça ne fonctionne pas
j'ai suivi un tuto sur opnclassroom mais ça ne donne rien sur mon script
vous pouvez me dire ce qui cloche et m'aidez à comprendre le truc?

Code : Tout sélectionner

<?php
switch($lvl)
{
case "admin":
echo '<ul id="menu-accordeon">
        <li><a href=""><img src="./images/home.png">Accueil</a></li>
        <li><a href=""><img src="./images/client.png">Client</a>
<ul>
        <li><a href="liste.php">liste client</a></li>
        <li><a href="nouveau-client.php?action=insert">Nouveau</a></li>
        <li><a href="suppression1.php">Suppression</a></li>
</ul></li>
        <li><a href=""><img src="./images/devis.png">Devis/fac</a>
<ul>
        <li><a href="facture.php">Facture</a></li>
</ul></li>
        <li><a href="stat.php"><img src="./images/stat.png">Stat</a></li>
        <li><a href=""><img src="./images/recherche.png">Recherche</a>
<ul>
        <li><a href="recherche.php?action=ville">Par ville</a></li>
        <li><a href="recherche.php?action=code-client">Par code client</a></li>
        <li><a href="recherche.php?action=devis">Par n° de devis</a></li>
</ul></li>
        <li><a href="agenda.php"><img src="./images/agenda.png">Planning</a></li>
        <li><a href=""><img src="./images/admin.png">Administration</a>
<ul>
        <li><a href="fiche-entreprise.php">Fiche entreprise</a></li>
        <li><a href="./modif-ent.php?action=insert">Enregistrement entreprise</a></li>
        <li><a href="produit.php">Produit</a></li>
        <li><a href="utilisateur.php">Liste utilisateur</a></li>
</ul></li>
<li><a href=""><img src="./images/home.png">Ticket</a>
<ul>
        <li><a href="incident.php?action=creer">Créer</a></li>';
$req=$db->prepare("SELECT COUNT(*) AS total FROM incident");
$req->execute();
if($req->rowCount()>0)
{
$row=$req->fetch();
        echo'<li><a href="incident.php?action=voir">Voir '.$row['total'].'</a></li>';
}
else
{
        echo'<li><a href="incident.php?action=voir">Voir</a></li>';
}
        echo'<li><a href="incident.php?action=resolu">Résolu</a></li>
        <li><a href="incident.php?action=non-resolu">Non résolu</a></li>
</ul></li>
      </ul>';
break;
case "secretariat":
echo '<ul id="menu-accordeon">
        <li><a href="index.php"><img src="./images/home.png">Accueil</a></li>
        <li><a href=""><img src="./images/client.png">client</a>
<ul>
        <li><a href="liste.php">liste client</a></li>
        <li><a href="nouveau-client.php?action=insert">nouveau</a></li>
</ul></li>
        <li><a href=""><img src="./images/devis.png">Devis/fac</a>
<ul>
        <li><a href="facture.php">facture</a></li>
</ul></li>
        <li><a href=""><img src="./images/recherche.png">Recherche</a>
<ul>
        <li><a href="recherche.php?action=ville">par ville</a></li>
        <li><a href="recherche.php?action=code_client">par code client</a></li>
	<li><a href="recherche.php?action=devis">Par n° de devis</a></li>
</ul></li>
        <li><a href="agenda.php"><img src="./images/agenda.png">planning</a></li>
        <li><a href=""><img src="./images/admin.png">administration</a>
<ul>
        <li><a href="fiche-entreprise.php">Fiche entreprise</a></li>
        <li><a href="produit.php">produit</a></li>
</ul></li>
      </ul>';
break;
case "util":
echo '<ul id="menu-accordeon">
        <li><a href="index.php"><img src="./images/home.png">Accueil</a></li>
        <li><a href=""><img src="./images/client.png">client</a>
<ul>
        <li><a href="liste.php">liste client</a></li>
</ul></li>
        <li><a href=""><img src="./images/devis.png">Devis/fac</a>
<ul>
        <li><a href="facture.php">facture</a></li>
</ul></li>
        <li><a href="stat.php"><img src="./images/stat.png">Stat</a></li>
        <li><a href=""><img src="./images/recherche.png">recherche</a>
<ul>
        <li><a href="recherche.php?action=ville">par ville</a></li>
        <li><a href="recherche.php?action=code_client">par code client</a></li>
</ul></li>
        <li><a href="agenda.php"><img src="./images/agenda.png">planning</a></li>
      </ul>';
break;
case "consult":
echo '<ul id="menu-accordeon">
        <li><a href="index.php"><img src="./images/home.png">accueil</a></li>
        <li><a href="liste.php"><img src="./images/client.png">client</a></li>
        <li><a href=""><img src="./images/devis.png">Devis/fac</a>
<ul>
        <li><a href="facture.php">facture</a></li>
</ul></li>
        <li><a href="stat.php"><img src="./images/stat.png">Stat</a></li>
        <li><a href="agenda.php"><img src="./images/agenda.png">planning</a></li>
      </ul>';
break;
}
?>
<script type="text/javascript">
function charger(){
    setTimeout( function(){
        $.ajax({
            url : "./include/menu.php",
            type : GET,
success : function(html){

                $('#menu-accordeon').load(); // on veut ajouter les nouveaux messages au début du bloc #messages

            }
        });
        charger();
    }, 5000);
}
charger();
</script>

merci de votre aide

28 juil. 2016, 11:43

salut,

la documentation de la fonction load de jQuery
cette fonction prend au moins un paramètre (du html).
Attention avec ça tu écrases tout ton menu.

tu veux juste modifier le nombre de ticket dans le lien ?
Dans ce cas il faut un fichier php qui reprend ta requête SQL

<?php
// je suppose qu'il y a, ici, l'inclusion d'un fichier pour la connexion au sgbd
// require_once 'lefichierdeconnexionalabasededonnées.php'; // important le once ;)
$req=$db->prepare("SELECT COUNT(*) AS total FROM incident");
$req->execute();
$count = 0;
if($req->rowCount()>0)
{
$row=$req->fetch();
$count = $row['total'];
}
echo $count;

ce fichier va afficher le nombre d'élément.

Ensuite il faut que tu supprimes la requête du code que tu indiques (au pire inclus le fichier au bon endroit histoire d'éviter de dupliquer le code).
ensuite dans le menu le html devient

<li><a href="incident.php?action=voir">Voir <span id="totalTicket">0</span></a></li>

le js devient simplement

<script type="text/javascript">
function chargerNbTicket(){
    setTimeout( function(){
        $.ajax({
            url : './lefichierquicontientlecodequejaimisplushaut.php',
            type : GET,
            success : function(lenombre){
                $('#totalTicket').html(lenombre); // on met a jour le nombre de ticket dans le menu
            }
        });
    }, 5000);
}
// parce que c'est mieux de le faire quand le page est affichée ;)
$(function() {
   chargerNbTicket();
});

voila grosso modo le principe

@+

28 juil. 2016, 12:03

ok merci de ton explication

oui en effet dès qu'un client ouvre un incident je voudrais que celà me le notifie avec le nombre d'incident ouvert
je vais voir ça et je te dis si tout ce passe bien.
en effet Il en faut peu pour être heureux ......

29 juil. 2016, 11:30

salut suivit ce que tu m'a expliqué et essayé aussi d'une autre manière mais les notifs ne se font pas sauf si j'actualise la page

Code : Tout sélectionner

<?php
echo '<ul id="menu-accordeon">
        <li><a href=""><img src="./images/home.png">Accueil</a></li>
        <li><a href=""><img src="./images/client.png">Client</a>
<ul>
        <li><a href="liste.php">liste client</a></li>
        <li><a href="nouveau-client.php?action=insert">Nouveau</a></li>
        <li><a href="suppression1.php">Suppression</a></li>
</ul></li>
        <li><a href=""><img src="./images/devis.png">Devis/fac</a>
<ul>
        <li><a href="facture.php">Facture</a></li>
</ul></li>
        <li><a href="stat.php"><img src="./images/stat.png">Stat</a></li>
        <li><a href=""><img src="./images/recherche.png">Recherche</a>
<ul>
        <li><a href="recherche.php?action=ville">Par ville</a></li>
        <li><a href="recherche.php?action=code-client">Par code client</a></li>
        <li><a href="recherche.php?action=devis">Par n° de devis</a></li>
</ul></li>
        <li><a href="agenda.php"><img src="./images/agenda.png">Planning</a></li>
        <li><a href=""><img src="./images/admin.png">Administration</a>
<ul>
        <li><a href="fiche-entreprise.php">Fiche entreprise</a></li>
        <li><a href="./modif-ent.php?action=insert">Enregistrement entreprise</a></li>
        <li><a href="produit.php">Produit</a></li>
        <li><a href="utilisateur.php">Liste utilisateur</a></li>
</ul></li>
<li><a href=""><img src="./images/home.png">Ticket</a>
<ul>
        <li><a href="incident.php?action=creer">Créer</a></li>';
//include('./totalTicket.php');
$req=$db->prepare("SELECT COUNT(*) AS total FROM incident");
$req->execute();
$count = 0;
if($req->rowCount()>0)
{
$row=$req->fetch();
$count = $row['total'];
echo'<li><a href="incident.php?action=voir">Voir <span id="totalTicket">'.$count.'</span></a></li>';
}
else
{
echo'<li><a href="incident.php?action=voir">Voir <span id="totalTicket">0</span></a></li>';
}
    echo'<li><a href="incident.php?action=resolu">Résolu</a></li>
        <li><a href="incident.php?action=non-resolu">Non résolu</a></li>
</ul></li>
      </ul>';
?>
<script type="text/javascript">
function chargerNbTicket(){
    setTimeout( function(){
        $.ajax({
            url : './include/menu.php',
            type : GET,
            success : function(lenombre){
                $('#totalTicket').html(lenombre); // on met a jour le nombre de ticket dans le menu
            }
        });
    }, 5000);
}
// parce que c'est mieux de le faire quand le page est affichée
$(function() {
   chargerNbTicket();
});
</script>

une idée?

29 juil. 2016, 12:01

as tu des erreurs js ?

normalement oui, il faut ouvrir la console du navigateur

(F12 généralement).
Le copier collé sans regarder c'est pas bien, tu aurais pu voir que la méthode de la requête ajax n'est pas définie comme une chaîne de caractères ce que JS n'aime pas du tout.

après test window.setInterval est plus indiquée que setTiemout

mon code de test fonctionnel

<html>
<head>
  <script src="https://code.jquery.com/jquery-3.1.0.min.js" integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s=" crossorigin="anonymous"></script>
</head>
<body>
<?php
echo '<ul id="menu-accordeon">
        <li><a href=""><img src="./images/home.png">Accueil</a></li>
        <li><a href=""><img src="./images/client.png">Client</a>
<ul>
        <li><a href="liste.php">liste client</a></li>
        <li><a href="nouveau-client.php?action=insert">Nouveau</a></li>
        <li><a href="suppression1.php">Suppression</a></li>
</ul></li>
        <li><a href=""><img src="./images/devis.png">Devis/fac</a>
<ul>
        <li><a href="facture.php">Facture</a></li>
</ul></li>
        <li><a href="stat.php"><img src="./images/stat.png">Stat</a></li>
        <li><a href=""><img src="./images/recherche.png">Recherche</a>
<ul>
        <li><a href="recherche.php?action=ville">Par ville</a></li>
        <li><a href="recherche.php?action=code-client">Par code client</a></li>
        <li><a href="recherche.php?action=devis">Par n° de devis</a></li>
</ul></li>
        <li><a href="agenda.php"><img src="./images/agenda.png">Planning</a></li>
        <li><a href=""><img src="./images/admin.png">Administration</a>
<ul>
        <li><a href="fiche-entreprise.php">Fiche entreprise</a></li>
        <li><a href="./modif-ent.php?action=insert">Enregistrement entreprise</a></li>
        <li><a href="produit.php">Produit</a></li>
        <li><a href="utilisateur.php">Liste utilisateur</a></li>
</ul></li>
<li><a href=""><img src="./images/home.png">Ticket</a>
<ul>
        <li><a href="incident.php?action=creer">Créer</a></li>';

echo'<li><a href="incident.php?action=voir">Voir <span id="totalTicket">0</span></a></li>';

    echo'<li><a href="incident.php?action=resolu">Résolu</a></li>
        <li><a href="incident.php?action=non-resolu">Non résolu</a></li>
</ul></li>
      </ul>';
?>
<script type="text/javascript">
function chargerNbTicket(){
    window.setInterval( function(){
        $.ajax({
            url : 'nbticket.php',
            type : 'GET',
            success : function(lenombre){
                $('#totalTicket').html(lenombre); // on met a jour le nombre de ticket dans le menu
            }
        });
    }, 5000);
}
// parce que c'est mieux de le faire quand le page est affichée
$(function() {
   chargerNbTicket();
});
</script>
</body>
</html>

j'ai virer la partie SQL, limite tu n'en a pas besoin la première requête ajax peu le faire pour toi.

le fichier nbticket.php est extrêmement complexe mais je poste quand même

<?php
echo rand();

@+

29 juil. 2016, 19:09

à quoi sert le 1er script js dans le head?

01 août 2016, 08:56

ça ?
<script src="https://code.jquery.com/jquery-3.1.0.min.js" integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s=" crossorigin="anonymous"></script>

forme classique d'import d'un fichier javascript. La en l’occurrence c'est jquery 3.1.0.
Vu la notation dans le code en bas j'ai supposé que c'est ce que tu utilises. (ou un dérivé). Si ce n'est pas le cas c'est relativement simple d'adapter.

@+

02 août 2016, 18:45

salut
me revoici le lourd

j'ai essayé ton code. donc là en effet ça donne un truc
mais il y a un truc bisare toute les 5 secondes j'ai une série de 10 chiffres qui change tout le temps or je n'ai que 5 incidents.
dans le fichier nbticket.php il n'y a que ran() à mettre?

02 août 2016, 22:19

c'est juste pour tester.
le bon code est ce qu'a donné moogli dans sa première réponse.

02 août 2016, 23:17

ok je retest.
ok c'est tout bon merci encore.
en revanche si le serveur web est en local, pas d'accès web et maj via un autre serveur le script dans head fonctionnera surement pas je suppose? y aurait il une autre solution?

ps: j'ai jamais fait de js...

03 août 2016, 10:10

tu parles de l'import de jquery ?
oui sans accès internet c'est cramé mais rien ne t’empêche de dl le fichier et de le mettre sur ton serveur web avec le reste de tes fichiers

soit tu utilise le lien qui est dans la balise script soit tu utilise le gros bouton sur la page d’accueil de jquery.com

@+

03 août 2016, 10:25

ok je vais test tout ça

en tout cas je vous remercie à tous de m'avoir aidé et d'avoir passer du temps dessus.
merci encore.
je le met en résolu

[RESOLU] ntification en temps réel

Qui est en ligne