trends4media

Bonjour,

je cherche à trier des images par drag and drop (j'y suis arrivé) dans des catégories et à ce que soit enregistré dans la BDD.
j'ai trouvé des choses dont je me suis inspiré mais impossible de finaliser :oops:

mais je souhaiterai aussi que quand on clique sur l'image, elle fasse apparaitre dans une div un formulaire pour ajouter des commentaires (si c'est pas trop demander :lol:)

Merci de votre aide !

Voici le code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133


<fieldset>
        <legend><h3 id="affich">Classement des photos et commentaires</h3></legend>


<div class="span5">


<?PHP 

  $path  = "http://www.mon-site.com/upload/$id_membre/cabinet";
  $pathS = "http://www.mon-site.com/upload/$id_membre/cabinet/small";




// Affiche les non classés
$resultat0 = mysql_query("SELECT * FROM $table_photos WHERE Pid=$id_membre AND Pcat='1' AND Pcategorie='' ORDER BY Pordre ASC");

        echo '<fieldset><legend><h4>Non class&eacute;</h4></legend>
              <div id="Non class&eacute;" class="sortable-list">'; 

 while ($row=mysql_fetch_array($resultat0)) { 

  if (mysql_num_rows($resultat0)==0) {echo 'Pas de photo';} 
  else {

  $Image = explode(".", $row["Pnom"]);
    $NomImage = $Image[0];
    $ExtentionImage = $Image[1];

echo '
    <a href="'.$path.'/'.$NomImage.'.'.$ExtentionImage.'" title="'.$row["Pdescriptif"].'" id='.$row["idPhoto"].'">
        <img src="'.$pathS.'/'.$NomImage.'_thumb.'.$ExtentionImage.'" alt="'.$row["Pdescriptif"].'" style="max-width: 50px;padding:5px;">
    </a> ';

        };
                                              }; // fin du while

echo '</div></fieldset>';





// Affiche les catégories                                              

$resultat1 = mysql_query("SELECT * FROM $table_cat_photos WHERE id_Mbre=$id_membre");

  $row1=mysql_fetch_array($resultat1); 

  $liste_cat = explode("##", $row1['categories'], "-1");
  for($i=0; $i<count($liste_cat);$i++ ) { list($CatOrdre, $CatNom) = explode("|", $liste_cat[$i]);

            echo '<fieldset><legend><h4>'.$CatNom.'</h4></legend>
              <div id="'.$CatNom.'" class="sortable-list">'; 


    // Affiche les images par catégories   
    $resultat2 = mysql_query("SELECT * FROM $table_photos WHERE Pid=$id_membre AND Pcat='1' AND Pcategorie=$CatNom ORDER BY Pordre ASC");

  if (mysql_num_rows($resultat2)==0) {echo '&nbsp;<br>';} 
  else {

 while ($row2=mysql_fetch_array($resultat2)) { 



  $Image = explode(".", $row2["Pnom"]);
    $NomImage = $Image[0];
    $ExtentionImage = $Image[1];

echo '
    <a href="'.$path.'/'.$NomImage.'.'.$ExtentionImage.'" title="'.$row2["Pdescriptif"].'" id='.$row2["idPhoto"].'">
        <img src="'.$pathS.'/'.$NomImage.'_thumb.'.$ExtentionImage.'" alt="'.$row2["Pdescriptif"].'" style="max-width: 50px;padding:5px;">
    </a> ';

        }; // fin du while
                                              }; 

echo '</div></fieldset><br>';

                                              }; // fin du for



?>



</div>

<div id="formulaire" class="span7">





</div>








<script>
var __links = document.querySelectorAll('a');
function __linkClick(e) { parent.window.postMessage(this.href, '*');} ;
for (var i = 0, l = __links.length; i < l; i++) {if ( __links[i].getAttribute('data-t') == '_blank' ) { __links[i].addEventListener('click', __linkClick, false);}}
</script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>

<script>$('.sortable-list').sortable({
  connectWith: '.sortable-list',
  update: function(event, ui) {
    var changedList = this.id;
    var order = $(this).sortable('toArray');
    var positions = order.join(';');

    console.log({
      id: changedList,
      positions: positions
    });
  }
});


</script>

trends4media

Pages

Tri images dans catégories et enregistrement base de donnée sujet

samedi 29 mars 2014

Macro tri une colonne de données par catégories sujet

vendredi 31 janvier 2014