Gérer l'ordre des éléments + sauvegarde en live en bd

Question

Bonjour à tous, J'aimerais faire la même chose que ce qu'il y a sur ce lien : http://www.sebastienangot.fr/blog/developpement/tutoriel-drag-and-drop-jquery-ajax-sauvegarde-en-base-de-donnees/ Mais seulement mes éléments (divs) ci-dessous ont des structures différentes dans une template (page). Je souhaiterais gérer leur ordre c-à-d les déplacer (ré-organiser) par glisser-déposer et ensuite sauvegarder en base de données comme dans le lien du tutoriel ci-haut . Les différences avec l'exemple du tutoriel dans le lien ci-dessus sont : moi j'ai des blocs (div) au lieu des listes (li) et dans le tutoriel c'est une boucle pour afficher les puces comme il s'agit des mêmes éléments. Dans mon cas les divs n'ont pas les mêmes éléments donc je ne peux pas faire de boucle, d'ou la récupération individuel des divs. Hors pour avoir de l'ordre il faut qu'il y ait une boucle. Existe-il de solutions sans boucle ? Merci Voici la structure de mes éléments : // Structure de la table `order`CREATE TABLE IF NOT EXISTS `order` ( `id` int(11) NOT NULL AUTO_INCREMENT, `titre` varchar(255) NOT NULL, `description` text NOT NULL, `image` varchar(255) NOT NULL, `lien` varchar(255) NOT NULL, `position` int(11) NOT NULL, PRIMARY KEY (`newsletter_id`)) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=4 ;

jordane45 · Answer

Bonjour, Tu veux afficher dans l'ordre .... ce qui implique que : Tu affiches le premier Puis le second Puis...... Puis le dernier ...; Comment veux-tu... sans boucle... que ton programme puisse afficher les éléments du 1er au dernier .... sans système de "boucle" ???? Tu as déjà posé cette question plusieurs fois... la réponse ne changera pas magie sous prétexte que tu la reposes à nouveau ! Je t'ai déjà dit que le fait de passer par une boucle ne posait pas de problème........ Il faut juste que (en base de donnée ou tout autre moyen de "stockage") tu précises pour chaque DIV à afficher... celle que tu veux et que tu CODES des fonctions qui crée CHACUNE de tes div. par exemple : //------------------------------------ // fonctions qui permettent de créer les différents types de DIV //------------------------------------ function div1(){ echo "

blablabla

"; } function divtruc(){ echo "

test

autre blablabla

"; } //------------------------------------ //recup des div à afficher en bdd par exemple stockées dans un array $a_afficher = array(); $a_afficher[] = array('quellediv'=>'div1'); $a_afficher[] = array('quellediv'=>'div1'); $a_afficher[] = array('quellediv'=>'div2'); //------------------------------------ //Et là... je génère l'affichage //... via une BOUCLE !!!! for ($i=0;$i<3;$i++){ $a_afficher[$i](); } Cordialement, Jordane

Utilisateur anonyme · Answer

Re @jordane45, Merci d'avoir pris le temps de me répondre. Mais je ne vois pas dans ton exemple le lien entre les fonctions qui permettent de créer les différents types de DIV et les div à afficher en bdd par exemple stockées dans un array. Procèderait t-on ainsi : // connexion BDrequire_once('db.php');$sql = 'SELECT * FROM maTable ORDER BY position';$req = $db->prepare($sql);$req->execute($q) or die(print_r($req->errorInfo()));$row = $req->fetchAll();switch ($row['id']) { case 1: function div1(){ echo "

$row['contenu_div1']

"; } break; case 2: function div2(){ echo "

$row['contenu_div2']

"; } break; case 3: function div3(){ echo "

$row['contenu_div3']

"; } break; ... default: code to be executed } Cdlt,

Utilisateur anonyme · Answer

Code modifié : // connexion BD require_once('db.php'); $sql = 'SELECT * FROM maTable ORDER BY position'; $req = $db->prepare($sql); $req->execute($q) or die(print_r($req->errorInfo())); $rows = $req->fetchAll(); foreach ($rows as $row){switch ($row['id']) { case 1: function div1(){ echo "

$row['contenu_div1']

"; } break; case 2: function div2(){ echo "

$row['contenu_div2']

"; } break; case 3: function div3(){ echo "

$row['contenu_div3']

"; } break; ... default: echo '';} }//------------------------------------//recup des div à afficher en bdd par exemple stockées dans un array$a_afficher = array('div_1','div_2','div_3'); for($i=1;$i

Utilisateur anonyme · Answer

Re, C'était juste pour dire j'ai fait des modifications mais j'attendrai pour faire le teste. Je sais que je demande trop mais toutes ces questions aideront peut être d'autres qui auront le même souci que moi. J'essayerai d'être plus explicite. En testant, j'ai remarqué qu'en ajoutant une autre DIV (bloc) qui n'est pas dans ma boucle la sauvegarde ne marche pas. Je sais que tu vas me dire oui c'est normal... Mais pour encore être plus explicite, je vais montrer un exemple. J'ai 2 blocs : bloc_1 et bloc_2. Je clone une DIV qui est dans le bloc_1 pour l’insérer dans le bloc_2. Et c'est le bloc_2 qui le bloc finale que je veux sauvegarder comme dans l'exemple précédent : // connexion BDrequire_once('db.php');$sql = 'SELECT * FROM maTable ORDER BY position';$req = $db->prepare($sql);$req->execute($q) or die(print_r($req->errorInfo()));$rows = $req->fetchAll();

contenu_div1

contenu_div2

contenu_div3

foreach ($rows as $row){ switch ($row['id']) { case 1:

contenu_div1

break; case 2:

contenu_div2

break; case 3:

contenu_div3

break; ... default: echo ''; } }

Utilisateur anonyme · Answer

Re @jordane45 En fait, ce que je souhaiterais faire c'est ajouter (c-à-d cloner) une DIV du bloc_1 dans le bloc_2 puis la sauvegarder pour qu'après rechargement de la page ma nouvelle DIV insérée reste afficher dans la liste de mes DIV qui sont dans la boucle (bloc_2). C'est un système d'ajout de modules (mes DIV sont de modules) comme c'est le cas dans certains systèmes d'édition de newsletter. Je peux rajouter des nouveaux modules puis les supprimer. Pour appuyer mon explication j'ai modifié le précédent code pour qu'on puisse comprendre ma démarche. Pour l'insertion d'un nouveau module (DIV) ça marche. C'est juste quand je rajoute ce dernier dans le bloc_2 je n'ai pas réussi à le sauvegarder. Je mets un lien qui illustre ce que je souhaiterais faire : https://topol.io/editor/5984cdb91dc32/edit Dans l'exemple qui est dans le lien c'est par glisser-déposer pour ajouter un élément mais dans mon cas l'élément est ajouté lorsqu'on le survole et clique sur "insert". Merci Cdlt, // connexion BDrequire_once('db.php'); $sql = 'SELECT * FROM maTable ORDER BY position';$req = $db->prepare($sql);$req->execute($q) or die(print_r($req->errorInfo()));$rows = $req->fetchAll();

contenu div 1

contenu div 2

contenu div 3

foreach ($rows as $row){ switch ($row['id']) { case 1:

contenu_div1

break; case 2:

contenu_div2

break; case 3:

contenu_div3

break; ... default: echo ''; } }

function(){ $("#mod01").hover(function() { $(".div_mod[data-type='mod01']").show(); $(".div_mod[data-type='mod02']").hide(); $(".div_mod[data-type='mod03']").hide(); }); $("#mod02").hover(function() { $(".div_mod[data-type='mod01']").hide(); $(".div_mod[data-type='mod02']").show(); $(".div_mod[data-type='mod03']").hide(); }); $("#mod03").hover(function() { $(".div_mod[data-type='mod01']").hide(); $(".div_mod[data-type='mod02']").hide(); $(".div_mod[data-type='mod03']").show(); }); $(".div_mod").hover( function() { $(this).append('

Insert

'); $('.add').click(function() { $("#div_1").prepend($("#bloc_1 .row[data-id='"+$(this).parent().attr("data-id")+"']").clone()); $("#dropdown").fadeOut(200); }); }, function() { $(this).children(".add").remove(); } ); })();

Utilisateur anonyme · Answer

Re @jordane45

Est-ce que mon dernier post est clair ?

Merci

Utilisateur anonyme · Answer

Ça c'est de la méchanceté. Tu aurais dû ne pas répondre que dire c'est  "bordélique". Il n'y personne qui t'oblige à répondre. Il faut quand un minimum de respect.

Gérer l'ordre des éléments + sauvegarde en live en bd

7 réponses

Votre réponse

Discussions similaires