Bonjour,
Sur une page PhP, j'affiche les données d'une base de données dans un tableau, que j'ai récupéré grâce à AJAX. Le tableau peut être ordonné, toujours grâce à AJAX (qui fait appel aux fonctionnalités SQL ASC et DESC). Le tableau peut également afficher plus ou moins de lignes, selon la volonté de l'utilisateur. Chaque ligne du tableau contient en plus des données un bouton permettant de supprimer la ligne dans la base de données.
Voilà mon problème : tant que je ne modifie pas le tableau via un des boutons grâce à AJAX, le bouton suppression fonctionne. Dès que les données sont mises à jour avec un des boutons, les boutons ne fonctionnent plus. J'avais déjà eu le problème avec les boutons permettant d'ordonner le tableau, et je l'avais réglé simplement en mettant à jour uniquement les données, mais pas le \<thead> ni \<tfoot>

Le tableau PhP affiché, après la modification par mon ajax :

$html_table = "";
    $sql = "SELECT * FROM `table`";
    if($result = $conn->query($sql)) {
        if ($result->rowCount() > 0) {
            $html_table.='<table class="select_db">';
            $html_table.='<thead>';
            $html_table.='<tr>';
                $html_table.='<th class="id">col0</th>';
                $html_table.='<th>col1<img src="img/sort_down.png" class="sort_d sorted"><img src="img/sort_up.png" class="sort_u"></img></th>';    $html_table.='<th>col2<img src="img/sort_down.png" class="sort_d"><img src="img/sort_up.png" class="sort_u"></img></th>';
                $html_table.='<th>col3<img src="img/sort_down.png" class="sort_d"><img src="img/sort_up.png" class="sort_u"></img></th>';
                $html_table.='<th>col4<img src="img/sort_down.png" class="sort_d"><img src="img/sort_up.png" class="sort_u"></img></th>';
                $html_table.='<th>col5<img src="img/sort_down.png" class="sort_d"><img src="img/sort_up.png" class="sort_u"></img></th>';
                $html_table.='<th>col6<img src="img/sort_down.png" class="sort_d"><img src="img/sort_up.png" class="sort_u"></img></th>';
            $html_table.='</tr>';
            $html_table.='</thead>';
            $html_table.='<tbody>';
            $sql = "SELECT `col0`, `col1`, `col2`, `col3`, `col4`, `col5`, `col6` FROM `table` ORDER BY `col1` ASC LIMIT 20 OFFSET 0 ";
            $html_table.='<tr>';
            // AJAX à partir d'ici
            foreach ($conn->query($sql) as $row) {
                $html_table.='<tr>';
                    $html_table.='<td class = "id">'.$row['col0'].'</td>';
                    $html_table.='<td class = "col1">'.$row['col1'].'</td>';
                    $html_table.='<td class = "col2">'.$row['col2'].'</td>';
                    $html_table.='<td class = "col3">'.$row['col3'].'</td>';
                    $html_table.='<td class = "col4">'.$row['col4'].'</td>';
                    $html_table.='<td class = "col5">'.$row['col5'].'</td>';
                    $html_table.='<td class = "col6">'.$row['col6'].'</td>';
                    $html_table.='<td class = "empty"></td>';
                    $html_table.='<td class = "rm"><img src="img/remove.png" alt="DEL"></td>';
            }
            // AJAX jusque là
            $html_table.='</tr>';
            $html_table.='</tbody>';
            $html_table.='<tfoot>';
            $html_table.='<td colspan="5"></td><td><div id="rem20">-</div><div id="count">20</div><div id="add20">+</div></td>';
            $html_table.='</tfoot>';
            $html_table.='</table>';
        }
        echo $html_table;
    }
    //...

Je ne sais pas comment créer mon tableau de tel sorte que la dernière colonne du tableau ne soit pas modifiée par ajax. Le principe du boutton est juste de récupérer le contenu de la colonne avec l'id, et de supprimer la ligne de la base de données (clé primaire) qui correspond.

Comment pourrais-je procéder ?

7 réponses


saibe
Réponse acceptée

hello,

Comment pourrais-je procéder ?

en utilisant un plugin qui sait très bien faire ça :)
dataTable en particulier....

Klayhan
Auteur

Ahah, si j'avais su, je me serais pas embêté.
Néanmoins, si je voulais le faire moi-même, je pourrais faire comment ?

lol ;)
pour faire bien les choses, il te faudra du temps car un certain nombre de lignes de code...
cela dit, ça peut être intéressant ;)

premièrement ne pas confondre ajax et php...
ajax, te permet de faire des requêtes serveur en javascript... tu peux demander un truc à un serveur et recevoir une réponse. il faut faire très attention car c "asynchrone" !!! aux vus des différents posts sur ce forum, peu de personne capte ce principe ;)
php est un langage serveur : tu peux "fabriquer du html" (c ton code), dialoguer avec des db (c ce que tu fais aussi), fabriquer des images, envoyer des mails, et plein d'autres trucs...

es-tu ok avec ces langages (javascript et php) et avec cette technique de dialogue (ajax) ?
je rajouterais : tu sais ce qu'est la POO ?

si oui, je peux te donner 2 3 pistes ;)

Klayhan
Auteur

Aucun souci sur la différenciation entre ajax et php, ajax permet de demander des données au serveur mais en aucun cas de les modifier. S'il le fait, ce qu'un code déjà installé sur le serveur le permet.
Pour ce qui est de javascript, mes connaissances se limitent globalement à la librairie jquery.
Quant à la POO, si on se limite aux langages web, javascript et le PDO de PhP (si je ne m'abuse) en sont.
Donc oui, dis-moi tout. Même si je vais probablement utiliser DataTables, ça m'intéresse malgré tout

;) oui je te conseille d'utiliser dataTable (en plus c un plugin jquery et si tu connais : c tout benef...)

après.... aux vus de tes réponses.... tout n'est pas très clair ;)
un conseil : il faut connaitre javascript avant jquery. jquery est une "extension" de javascript, et elle ne propose pas tout à fait la même manière de procéder avec les éléments dom. par contre elle va te donner plein de raccourcis compatibles très utiles...

quant à la "Programmation Orienté Object", je pense que tu ne connais pas trop...
du coup, cela va être laborieux d'obtenir ce que tu cherches...
cela demande un niveau de connaissance "minimal" cad quelques années d'apprentissage et de pratique...

au final : essaie de comprendre comment dataTable fonctionne... essaie de le remplir en ajax... de lui ajouter des fonctions... tu apprendras plein de trucs utiles pour ta formation en programmation...

continue à coder !!!

Klayhan
Auteur

Ok très bien, tu sais probablement mieux que moi je vais me limiter à dataTable pour l'instant. Merci ^^

;) ce n'est pas condescendant... ;) j'essaie juste d'aider...
si tu as un soucis avec dataTable, n'hésite pas à poster un sujet "pb avec dataTable ajax", je me ferai un plaisir de te répondre et ça peut aider d'autres personnes...
merci pour le "résolu"
++