11521 sujets

JavaScript, DOM et API Web HTML5

Bonjour,
jusqu’à maintenant j'utilise sur mon site pour ouvrir sous forme de popup la fonction Dialog que l'on trouve ici (http://jqueryui.com/dialog/#animated)
cette fonction dans son exemple ne fonctionne que pour un popup mais je suis en train de refaire mon site et j'aurai besoin que cette fonction fonctionne pour ouvrir plusieurs popup (de données sorties de base de données avec des id unique).

J'ai donc actuellement dans mon head

  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script>

  $(function() {
    $( "#dialog" ).dialog({
      autoOpen: false,
      show: {
        effect: "blind",
        duration: 1000
      },
      hide: {
        effect: "explode",
        duration: 1000
      }
    });

    $( "#opener" ).click(function() {
      $( "#dialog" ).dialog( "open" );
    });
  });

  </script>


et dans mon body :

while( $result = mysql_fetch_array( $reqact ) )
			{			
<div id="dialog" title="<?PHP echo stripslashes($result['type']); ?>">
		<p><?php  echo stripslashes($result['description']);?></p>
		</div>
		<button id="opener">Voir le detail de <?PHP echo stripslashes($result['type']); ?></button>
}


le problème est qu'en mettant du php avec plusieurs données sa ne fonctionne plus.
Je pense que le problème viens de id="dialog" et id="opener" mais je planche dessus depuis hier et je n'arrive pas a faire en sorte que cela fonctionne.
Hello,

Et si tu utilisais tout simplement des classes pour lancer tes fenêtres ?

Je modifie légèrement ton JS :

$(function() {
    $( ".dialog" ).dialog({
      autoOpen: false,
      show: {
        effect: "blind",
        duration: 1000
      },
      hide: {
        effect: "explode",
        duration: 1000
      }
    });

    $( ".opener" ).click(function() {
      $(this).prev( ".dialog" ).dialog( "open" );
    });
  });

et ton PHP/HTML :

while( $result = mysql_fetch_array( $reqact ) )
			{			
<div class="dialog" title="<?PHP echo stripslashes($result['type']); ?>">
		<p><?php  echo stripslashes($result['description']);?></p>
		</div>
		<button class="opener">Voir le detail de <?PHP echo stripslashes($result['type']); ?></button>
}

Non ?