UI Dialog. J'aimerais utiliser cette boîte de dialogue pour afficher une facture

skins · 11/06/2011, 11h03

Bonjour
Je suis face à une problématique qui nécessite a mon avis plusieurs Post.

Bon voilà, j'aimerais utiliser les boites de dialogue comme celle de ce site
qui affichera une facture.

Est ce possible ?

Merci d'avance pour votre aide

charly-b · 11/06/2011, 11h16

Salut,

Je ne saisis pas vraiment le problème . Il te suffit d'appeler jQuery & jQueryUI dans le head, puis :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
<div id="facture">Contenu de la facture</div>
<script>
   $(function() {
      $( "#facture" ).dialog();
   });
</script>

skins · 11/06/2011, 11h48

Merci charly-b pour votre réponse, cela me réconforte le faite que vous dites qu'il n y a pas de problème

néanmoins j'aurais besoin d'un coup de main supplémentaire, pour l’intégration de jQuery & jQueryUI.

Merci d'avance

charly-b · 11/06/2011, 11h57

Il faut aller sur : http://jqueryui.com/download, et "Download" .

Tu récupères les dossiers js et css dans le zip et tu les colle dans la racine de ton site.
Puis dans le <head></head> de ta page :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<link type="text/css" href="css/themename/jquery-ui-1.8.13.custom.css" rel="Stylesheet" />	
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.13.custom.min.js"></script>

(Vérifie le nom des fichiers, la version est peut-être différente) .

Ensuite dans le body, si par exemple tu veux afficher la facture au clic d'un bouton, tu peux faire :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<button type="button" onclick="afficheFacture();">Afficher la facture</button>
<div id="facture" style="display:none;">Contenu de la facture</div>
<script>
function afficheFacture()
{
    $('#facture').dialog();
}
</script>

Sur les pages de démos, penses à regarder la source des exemples (bouton view source), ça t'aideras à comprendre le fonctionnement du truc.

A+

skins · 11/06/2011, 12h12

~~Je ne sais pas mais est ce que je dois utiliser une fonction function afficheFacture() dans le head non ?~~

~~Ok je vois maintenant mais comment ouvrire une page dedans ?~~

Enfaite je viens d'ouvrir une page dedans

mais le vrai problème mnt c'est que :

Avant j'avais des boutons crées avec une boucle PHP qui affecte une valeur (ref facture)dans chaque bouton qui le transmet a son tour a la fonction qui appel un fichier PHP qui lui effectue une recherche dans la BD pour afficher les donnée de la facture.
Le problème c'est que les pages .php ne s'ouvrent pas dans le pop up

Comment puis-je le faire mnt ?

Merci d'avance

charly-b · 11/06/2011, 14h12

Il faudrait aller chercher ta facture en ajax.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<button type="button" onclick="afficheFacture(12);">Afficher la facture</button>
<div id="facture" style="display:none;"></div>
<script>
function afficheFacture(factureID)
{
    $.ajax({
       url: 'php/phpDesFactures.php?getFacture='+factureID,
       success: function (reponse)
       {
          $('#facture').html(reponse);
          $('#facture').dialog();
       }
    });    
}
</script>

Le button étant généré par le php, le "12" étant l'id de la facture, "phpDesFactures.php" le fichier php qui écrit la facture, et "getFacture" la variable GET transmise à "phpDesFactures.php" pour générer la facture voulue .

Je ne sais pas si c'est très clair, dis moi si ça te parait obscur .
J'ai mis le <script> à la suite, mais tu as raison, il vaut mieux le mettre dans le <head>

skins · 11/06/2011, 17h03

mmmmm je me suis casser la tête un peut avec cette nouveauté mais je n'arrive a avoir le bout du fil

Pouvez vous m'aidez SVP

charly-b · 11/06/2011, 17h09

Peux-tu afficher le code en question ?

skins · 11/06/2011, 17h15

ci-dessous le code (j'en suis pas fière

)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<?php
$reponse = mysql_query("select * FROM jos_pack where id_user = '$iduser' AND Validation = '1' ORDER BY id DESC");
while ($donnees = mysql_fetch_array($reponse))
{
$idinter = $donnees['id'];
$Type = $donnees['Type'];
?>
 
<button type="button" onclick="afficheFacture(<?php echo $idinter ; ?>);">Afficher la facture</button>
<div id="facture" style="display:none;"></div>
<script>
function afficheFacture(idinter)
{
    $.ajax({
       url: 'Ajax/View_Inter_Soft'+idinter,
       success: function (reponse)
       {
          $('#facture').html(reponse);
          $('#facture').dialog();
       }
    });    
}
</script>

j'aimerais bien déplacer la fonction dans le hearder

charly-b · 11/06/2011, 17h53

Ah ok, laisse tomber l'ajax.
Tu peux le faire comme ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<?php
$reponse = mysql_query("select * FROM jos_pack where id_user = '$iduser' AND Validation = '1' ORDER BY id DESC");
while ($donnees = mysql_fetch_array($reponse))
{
$idinter = $donnees['id'];
$Type = $donnees['Type'];
?>
 
<button type="button" onclick="afficheFacture(<?php echo $idinter ; ?>);">Afficher la facture</button>
<div id="facture_<?php echo $idinter ; ?>" style="display:none;" class="facture">Contenu de la facture</div>
<?php 
}
?>
<script>
function afficheFacture(idinter)
{   
    $('.facture').dialog('destroy');  // Si une facture est déjà ouverte, on la ferme
    $('#facture_'+idinter).dialog();  // Ouvre la facture correspondante
}
</script>

skins · 11/06/2011, 18h08

cela m'affiche un bouton pour chaque facture, mais est ce que je peux mettre une page php dans contenu du pop up ?

charly-b · 11/06/2011, 18h21

Oui, avec un include, ou en ajax.

Bon courage

skins · 11/06/2011, 19h47

un dernier coup de pousse SVP

J ai crée mis cette fonction dans le header

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
function afficheFacture(idinter){
$('#facture_'+idinter).dialog();
this.idinter= idinter;
var xhr = getXhr();
xhr.onreadystatechange = function(){
 if(xhr.readyState == 4 && xhr.status == 200){
leselect = xhr.responseText;
document.getElementById('facture_'+idinter).innerHTML = leselect;
					}
				}
document.getElementById('facture_'+idinter).innerHTML = "<p><table><tr><td><img src='images/loading.gif'></td><td><font color='#345E6F' size='2'>Chargement</font></td></tr></table></p>";
xhr.open("POST","templates/CA_Gris_Turquoi3/Ajax/View_Inter.php",true);
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xhr.send("idInter="+idinter);
 
			}

et pour le bouton :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?php
$user =& JFactory::getUser();
$iduser= $user->get('id');
$reponse = mysql_query("select * FROM jos_pack where id_user = '$iduser' AND Validation = '1' ORDER BY id DESC");
while ($donnees = mysql_fetch_array($reponse))
{
$idinter = $donnees['id'];
$Type = $donnees['Type'];
?>
 
<button type="button" onclick="afficheFacture(<?php echo $idinter ; ?>);">Afficher la facture</button>
<div id="facture_<?php echo $idinter ; ?>" style="display:none;" class="facture">
</div>
<?php 
}
?>

J ai vérifier la requête fonctionne correctement, avec firebug la réponse est bien la , mais je n'arrive pas a l'afficher

Merci pour votre aide

charly-b · 12/06/2011, 10h52

Je ne peux pas t'aider davantage, je n'utilise pas du tout l'XMLHttpRequest, mais jQuery, comme illustré plus haut.
J'espère que quelqu'un va pouvoir t'aider .

skins · 12/06/2011, 20h34

Bonjour
Ce n'est pas grave vous m étiez d une aide précieuse

J vais tenter un truc, je vous tiens au courant

11/06/2011, 11h03	#1
skins Futur Membre du Club Développeur informatique Inscription : décembre 2008 Messages : 97 Détails du profil Informations personnelles : Sexe : Âge : 29 Localisation : Maroc Informations professionnelles : Activité : Développeur informatique Secteur : Conseil Informations forums : Inscription : décembre 2008 Messages : 97 Points : 15 Points : 15	UI Dialog. J'aimerais utiliser cette boîte de dialogue pour afficher une facture Bonjour Je suis face à une problématique qui nécessite a mon avis plusieurs Post. Bon voilà, j'aimerais utiliser les boites de dialogue comme celle de ce site qui affichera une facture. Est ce possible ? Merci d'avance pour votre aide
	00

11/06/2011, 17h09	#8
charly-b Membre régulier Développeur Web Inscription : juin 2011 Messages : 49 Détails du profil Informations personnelles : Sexe : Âge : 27 Localisation : France Informations professionnelles : Activité : Développeur Web Secteur : High Tech - Produits et services télécom et Internet Informations forums : Inscription : juin 2011 Messages : 49 Points : 71 Points : 71	Peux-tu afficher le code en question ? __________________ www.jquery-buttons.com / www.biscay-charly.com
	00

11/06/2011, 18h21	#12
charly-b Membre régulier Développeur Web Inscription : juin 2011 Messages : 49 Détails du profil Informations personnelles : Sexe : Âge : 27 Localisation : France Informations professionnelles : Activité : Développeur Web Secteur : High Tech - Produits et services télécom et Internet Informations forums : Inscription : juin 2011 Messages : 49 Points : 71 Points : 71	Oui, avec un include, ou en ajax. Bon courage __________________ www.jquery-buttons.com / www.biscay-charly.com
	00

12/06/2011, 10h52	#14
charly-b Membre régulier Développeur Web Inscription : juin 2011 Messages : 49 Détails du profil Informations personnelles : Sexe : Âge : 27 Localisation : France Informations professionnelles : Activité : Développeur Web Secteur : High Tech - Produits et services télécom et Internet Informations forums : Inscription : juin 2011 Messages : 49 Points : 71 Points : 71	Je ne peux pas t'aider davantage, je n'utilise pas du tout l'XMLHttpRequest, mais jQuery, comme illustré plus haut. J'espère que quelqu'un va pouvoir t'aider . __________________ www.jquery-buttons.com / www.biscay-charly.com
	00

11/06/2011, 11h48	#3
skins Futur Membre du Club Développeur informatique Inscription : décembre 2008 Messages : 97 Détails du profil Informations personnelles : Sexe : Âge : 29 Localisation : Maroc Informations professionnelles : Activité : Développeur informatique Secteur : Conseil Informations forums : Inscription : décembre 2008 Messages : 97 Points : 15 Points : 15	Merci charly-b pour votre réponse, cela me réconforte le faite que vous dites qu'il n y a pas de problème néanmoins j'aurais besoin d'un coup de main supplémentaire, pour l’intégration de jQuery & jQueryUI. Merci d'avance
	00

11/06/2011, 12h12	#5
skins Futur Membre du Club Développeur informatique Inscription : décembre 2008 Messages : 97 Détails du profil Informations personnelles : Sexe : Âge : 29 Localisation : Maroc Informations professionnelles : Activité : Développeur informatique Secteur : Conseil Informations forums : Inscription : décembre 2008 Messages : 97 Points : 15 Points : 15	~~Je ne sais pas mais est ce que je dois utiliser une fonction function afficheFacture() dans le head non ?~~ ~~Ok je vois maintenant mais comment ouvrire une page dedans ?~~ Enfaite je viens d'ouvrir une page dedans mais le vrai problème mnt c'est que : Avant j'avais des boutons crées avec une boucle PHP qui affecte une valeur (ref facture)dans chaque bouton qui le transmet a son tour a la fonction qui appel un fichier PHP qui lui effectue une recherche dans la BD pour afficher les donnée de la facture. Le problème c'est que les pages .php ne s'ouvrent pas dans le pop up Comment puis-je le faire mnt ? Merci d'avance
	00

11/06/2011, 17h03	#7
skins Futur Membre du Club Développeur informatique Inscription : décembre 2008 Messages : 97 Détails du profil Informations personnelles : Sexe : Âge : 29 Localisation : Maroc Informations professionnelles : Activité : Développeur informatique Secteur : Conseil Informations forums : Inscription : décembre 2008 Messages : 97 Points : 15 Points : 15	mmmmm je me suis casser la tête un peut avec cette nouveauté mais je n'arrive a avoir le bout du fil Pouvez vous m'aidez SVP
	00

11/06/2011, 18h08	#11
skins Futur Membre du Club Développeur informatique Inscription : décembre 2008 Messages : 97 Détails du profil Informations personnelles : Sexe : Âge : 29 Localisation : Maroc Informations professionnelles : Activité : Développeur informatique Secteur : Conseil Informations forums : Inscription : décembre 2008 Messages : 97 Points : 15 Points : 15	cela m'affiche un bouton pour chaque facture, mais est ce que je peux mettre une page php dans contenu du pop up ?
	00

12/06/2011, 20h34	#15
skins Futur Membre du Club Développeur informatique Inscription : décembre 2008 Messages : 97 Détails du profil Informations personnelles : Sexe : Âge : 29 Localisation : Maroc Informations professionnelles : Activité : Développeur informatique Secteur : Conseil Informations forums : Inscription : décembre 2008 Messages : 97 Points : 15 Points : 15	Bonjour Ce n'est pas grave vous m étiez d une aide précieuse J vais tenter un truc, je vous tiens au courant
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email