Forum : Enregistrer des elements "sortable.js" (jQuery-ui)

Bonjour,

Voilà, je suis en train de coder un CMS pour créer une newsletter. Pour reclasser les articles dans un ordre personnalisé, j'utilise la fonction sortable.js. J'arrive à enregistrer les éléments quand je ne mets rien de dynamique dans mon code, mais dès que je mets une boucle while, je suis perdu.

Voici mon code :

<div class="drag"> <?php $i = 0; $req = $db->prepare ("SELECT * FROM content WHERE news_id={$_GET["id"]}"); $req->execute($d); while ($data = $req->fetch(PDO::FETCH_OBJ)){ $article = $data->contenu; $item = array('<div id="item_'.$i++.'" class="news '.$data->size.' '.$data->color.'"> <img src="img/vignette.png"> <a class="photo" href="'.$data->link.'" target="_blank"><img src="imgs/thumb/'.$data->img.'" width="251" height="141"></a> <h2>'.$data->titre.'</h2> <p>'.reduireChaineCar($article, 200).'</p> <a class="link" href="'.$data->link.'" target="_blank"><span>en savoir +</span></a> </div>' ); } $req = $db->prepare('SELECT data FROM list WHERE id=1'); $req->execute($d); $data = $req->fetchAll(); foreach ($data as $key => $value) { print_r($item[$value]); } ?> </div>

mon code js pour classer les news :

$(function(){ $('.drag').sortable({ revert: true, cancel: "p,h2", update: function(event, ui) { var postData = $(this).sortable('serialize'); console.log(postData); $.post('save.php', {list: postData}, function(o){ console.log(o); }, 'json'); } }); });

et l'endroit où je sauvegarde mon code (save.php) :

<?php require 'includes/bdd_connect.php'; $list = $_POST['list']; $output = array(); $list = parse_str($list, $output); $save = implode(',',$output['item']); echo $save; $stmt = $db->prepare("UPDATE list SET data ='$save' WHERE id=1"); $update = $stmt->execute(); ?>

Evidemment, avec ce code, plus rien ne s'affiche!! Pourtant, si je ne mets pas ma boucle while, et je rentre du code html dans mon array, ça marche très bien!! Aussi, si je fais un print_r de mon code, plutôt qu'un array, la newsletter s'affiche, mais quand je bouge les éléments, la sauvegarde ne fonctionne pas!!

Ma structure de ma base list :
CREATE TABLE list (
id int(11) NOT NULL,
data text NOT NULL
) ENGINE=InnoDB AUTO_INCREMENT=2 DEFAULT CHARSET=latin1;

Pensez-vous pouvoir m'aider à résoudre ce problème ?

Voici le tuto que j'ai suivi pour l'enregistrement dans ma base : https://youtu.be/3mOs0VY_sIw?list=PLC585075FF002B2C9

Merci à tous!!

1 réponse

p1ngouin,

il y a 10 ans

Au niveau du fonctionnement du code, il n'y a rien de bien compliqué. Tu affiches une banale liste d'articles. Lorsque tu fais du drag&drop sur tes articles, tu récupères le hook de la fonction afin de pouvoir envoyer une requête en AJAX pour mettre à jour l'ordre. Sauf que pour mettre à jour l'ordre de tes éléments, il te faut diverses entrées dans ta base de données afin de stocker le tout, par exemple :

CREATE TABLE list ( id int(11) NOT NULL, data text NOT NULL, order int(2) NOT NULL )

Grâce à ça, tu as tes articles qui peuvent être trié sur une valeur qui n'est pas primaire. Du coup, lorsque tu feras ta première récupération d'élements, il faudra simplement que tu fasses une requête en triant par défaut sur l'ordre actuellement stocké dans la base. Ensuite, dès que tu seras dans ta requête AJAX et que ton serveur reçevera les nouvelles données, tu auras simplement à mettre à jour les nouveaux élements, un peu comme ça :

// Get all articles from the request sent by the client side $articles = json_decode($_POST["articles"]); // For each news, we'll update it with the newest position attributed by the client side foreach ($articles as $article) { $statement = $db->prepare("UPDATE articles SET order = ? WHERE id = ?"); $statement->execute([$article->order, $article->id]); }

Cependant, je n'ai pas réellement compris l'intégrité de ton code. Tu expliques en tête que tu as une liste d'articles que tu souhaites envoyer via une newsletter. Cependant, lorsque tu récupères tes éléments, tu récupères d'abord un article, puis ensuite, tu vas taper dans une table list. En plus, tu fais un update dessus, mais tu n'es même pas sûr d'avoir des données à l'intérieur étant donnée les requêtes. De ce que je comprends, tu met en fait le contenu HTML de tes articles directement dans la nouvelle table. Et dans un sens, tu ne peux pas réellement faire ça. Si tu souhaites envoyer ces informations par mail, pourquoi tu ne fais un simple système d'association entre les listes de diffusions et les articles ?

CREATE TABLE list ( id int(11) NOT NULL, article int(11) NOT NULL, order int(2) NOT NULL, )

Du coup, tes requêtes sont beaucoup plus simples. Tu as simplement à faire une jointure entre les deux tables pour récupérer les informations. Quant au rendu, tu peux le faire directement dans un fichier PHP à part, par lequel, le rendu sera fait lors de l'envoi de l'HTML en newletter.

J'espère avoir été assez clair dans mes propos...