begin process at 2012 02 12 00:05:26
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Navigation

 > PERSONNALISER LES BOÎTES DE DIALOGUE

PERSONNALISER LES BOÎTES DE DIALOGUE


 Information sur la source

Note :
9,67 / 10 - par 6 personnes
9,67 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Navigation Classé sous :alert, dialogue, personnaliser, scriptaculous, prototype Niveau :Débutant Date de création :22/08/2007 Vu / téléchargé :19 984 / 2 094

Auteur : XtremDuke

Ecrire un message privé
Commentaire sur cette source (37)
Ajouter un commentaire et/ou une note

 Description

Cliquez pour voir la capture en taille normale
Bonjour,


Suite à une question qui m'a été récement posée, voilà un script qui permet afficher une boite de dialoque personnalisée.
J'espère que ça répondra aux questions.



 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Sources du même auteur

Source avec une capture ANIMATION VIA LES ÉQUATIONS DE ROBERT PENNER
Source avec Zip Source avec une capture EXPLORATEUR WEB
Source avec Zip Source avec une capture PERSONNALISER SES SELECT

 Sources de la même categorie

Source avec Zip Source avec une capture ANTI-ROBOTS V 1.0 par MacGaliver
Source avec une capture PRÉSENTOIR PAGE/SUJET par tiranus
Source avec Zip Source avec une capture NAVIGATEUR INTERNET HAVRET par HAVRETos
Source avec Zip WMANAGER.JS : GÉRER LES FICHIERS WMA AVEC WINDOWS MEDIA PLAY... par jdmcreator
Source avec Zip Source avec une capture NAVIGATION PAR AJAX, CHARGEMENT DES PAGES SANS RECHARGEMENT par zulrigh

 Sources en rapport avec celle ci

Source avec Zip DIALOGUE ENTRE FENÊTRES MÈRE ET FILLE par william voirol
Source avec Zip JOLIE ALERTE AVEC "ALERT()" par heycraft
Source avec Zip Source avec une capture EXPLORATEUR WEB par XtremDuke
Source avec Zip Source avec une capture PERSONNALISER SES SELECT par XtremDuke
Source avec Zip PLUGIN BDDR, À INTÉGRER DANS VOS PAGES WEB, PERMET UNE UTILI... par odinh

Commentaires et avis

Commentaire de cedriclomb le 24/08/2007 09:45:40

Trop bien tu peux faire pareil avec les confirm ?? 10/10

Commentaire de popGG le 24/08/2007 09:48:04

C'est beaux et le code est propre. Rien à dire! J'ai hâte de voir toutes les merveilles que tu peux nous offrir avec Script.aculo.us.

C'est sans contexte un 10 ;D

Petit reproche néanmoins: je pense que tu devrais commenter un peu plus tes sources, surtout au niveau du js.

@+

Commentaire de amezghal le 24/08/2007 13:36:17

salut
la boite à message n'est pas modal...
donc ton bouton "valider" sert à rien, car le script va continué de s'executé

Commentaire de XtremDuke le 24/08/2007 16:22:34

amezghal, remplace le bouton "valider" par un bouton "fermer" ^^

Commentaire de popGG le 24/08/2007 18:02:14

Bien vu amezghal! Je n'ai pas fait attention à ce détail. En fait, modal signifie que l'alerte doit être fermer pour récupérer le focus sur ta page HTML. (je savais pas trop la définition, merci google)

Actuellement, sur ta source, on peut réaliser d'autres opérations tout en mettant ton message sur le côté. (bon c'est pas trop génant ce truc... Ton message a bien été envoyé et j'ai pu lire son contenu ce qui est, avant tout, son boulot non??).

Je suis pas expert prototype.js ou scriptaculous donc je préfère ne pas dire de connerie mais je pense qui y a moyen de contourner le problème avec des evenements (quand j'sais pô, j'bidouille voila!...). Mais perso, je laisserais tel quel car le modal d'un alert ne sert à rien (c'est mon avis).

En tout cas, merci pour ta source, je vais surement l'utiliser pour mon site perso si ça ne te gène pas (z'aime bien ze qui est zolie)...

Commentaire de XtremDuke le 25/08/2007 09:48:41

Je suis de l'avis de popGG : contrairement à un prompt ou à un confirm, je ne vois pas l'interet pour une alert de geler l'execution du script.

Il est tout à fait possible de simuler une alert modale en créant un calque absolu avec les dimensions de la fenêtre puis de la surcoucher avec la boite de dialogue. (un calque noir avec une opacité de .75 est du bel effet)

Commentaire de amezghal le 25/08/2007 13:16:45

modale=le script arrete son execution jusquà qu'on clique sur un bouton, or la solution que ta proposé(claque noir avec opacité x.xx) ne permet pas ça, donc ce script sert seulement à afficher des messages, donc tu peux pas l'améliorer pour qu'il simule un "confirm"
..., car "modale" est une fonction systeme.

Commentaire de XtremDuke le 27/08/2007 09:24:43

amezghal :
Je suis tout à fait d'accord avec toi mais comme je l'ai dit plus haut, ce script n'est applicable qu'à une alert et non un prompt ou un confirm.
Ensuite, et par définition, une fenetre modale est une fenetre dont la fermeture est obligatoire pour récuperer de focus de son parent... c'est tout. Le fait que les navigateurs gèlent les scripts pendant l'execution d'une fenetre modale n'a rien à voir avec le concept de modalité.

Have Fun

Commentaire de xenodus le 27/08/2007 19:30:31

pour simuler un un modal met un flag que tu test dans une timer sa voir une boucle mais bon risque de gele des navigateur a toi de voir

Commentaire de popGG le 30/08/2007 09:20:07

Salut XtremDuke,

Bien que la modalité d'un alert ne soit pas vraiment un problème (pour moi en tout cas), je pense que tu devrais essayer de résoudre ce conflit. Sachant que le "modal" est une fonction système, j'ai trouvé une source intéressante que je te conseille de regarder:
http://www.javascriptfr.com/code.aspx?ID=34989
window.showModalDialog me semble approprié pour une éventuelle évolution de ton alert.

Bonne journée

Commentaire de XtremDuke le 31/08/2007 10:10:50

Salut popGG et merci pour ton commentaire. Cependant, window.showModalDialog est une instruction réservée à IE... Il n'y a pas de remède miracle pour reproduire vraiment une fenêtre modale. Enfin à ma connaissance. La seule alternative est de 'locker' l'interface.

Commentaire de SpySeth le 28/10/2007 07:37:29 8/10

Pour cette source soit parfaite il faudrait que même lorsque les CSS sont désactivé l'on ne voit pas la boite de dialogue.

Commentaire de Florent06 le 28/11/2007 14:48:48 10/10

superbe !!! 10/10

par contre, est-ce qu'on peut faire en sorte qu'il y ait un évènement "hover" sur le bouton "Valider" ? De manière à faire comme sur le bouton qui ferme la fenêtre.

Commentaire de karimflashmx le 26/12/2007 15:23:11

salut merci pour le script c'est génial mais je veut voir comment on peut personaliser la position de la boite d'alert au melieu de l'ecran , c'est a dire si j'ai en bas de ma page un champs pour inserer une adresse email et un bouton valider alors quand j'ai fait le test je trouve que la boite s'affiche en haut ce qui meme ne se voi pas .
  

Commentaire de SpySeth le 28/12/2007 14:19:09

karimflashmx > Remplace la fonction centerOnScreen() par ce code :

function centerOnScreen(obj){
var screenOffsetWidth = getLayoutOffsets()[0];
var screenOffsetHeight = getLayoutOffsets()[1];

var screenHeightDecal = window.pageYOffset || document.body.scrollTop;

if(obj.style.position!='absolute') obj.style.position = 'absolute';
obj.style.left = (screenOffsetWidth/2)-(obj.getWidth()/2)+'px';
obj.style.top = (screenOffsetHeight/2)-(obj.getHeight()/2)+screenHeightDecal+'px';
}

Commentaire de SpySeth le 29/12/2007 09:36:56

J'ai remarqué une erreur dans cette modification, désolé.

Donc il faut pour que ça fonctionne remplacer la fonction gerLayourOffsets() ET la fonction centerOnScreen() par ça :

function getLayoutOffsets(){
var de = document.documentElement;
var screenWidth = window.innerWidth || self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth;
var screenHeight = window.innerHeight || self.innerHeight || (de&&de.clientHeight) || document.body.clientHeight;
var screenHeightDecal = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
return [screenWidth,screenHeight,screenHeightDecal];
}

function centerOnScreen(obj){
var screenOffsetWidth = getLayoutOffsets()[0];
var screenOffsetHeight = getLayoutOffsets()[1];
var screenOffsetHeightDecal = getLayoutOffsets()[2];

if(obj.style.position!='absolute') obj.style.position = 'absolute';
obj.style.left = (screenOffsetWidth/2)-(obj.getWidth()/2)+'px';
obj.style.top = (screenOffsetHeight/2)-(obj.getHeight()/2)+screenOffsetHeightDecal+'px';
}

Commentaire de karimflashmx le 29/12/2007 21:13:08

salut SpySeth merci pour ton aide , j'ai utilisé ton premier code et vraiment ca marche très bien je sais pas est-ce que il ya il une erreur ? si oui c'est quoi exactement ?
merci

Commentaire de SpySeth le 02/01/2008 09:25:21

Dans le premier code, j'utilise une technique qui ne fonctionne que sous les navigateurs qui respecte les standards (Firefox, Opéra, Safari...) et Internet Explorer version 5.5 et inférieur. Pour IE 6 et 7 cela ne fonctionne pas :

var screenHeightDecal = window.pageYOffset || document.body.scrollTop;

window.pageYOffset <-- compris par Firefox et compagnie
document.body.scrollTop; <-- compris par IE 5.5 et moins


C'est pour ça que dans le deuxième code j'ai ajouter la méthode pour IE 6 et 7 :

var screenHeightDecal = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
return [screenWidth,screenHeight,screenHeightDecal];

document.documentElement.scrollTop <-- pour IE 6 et 7


J'ai aussi rendu le code plus logique : c'est la fonction getLayoutOffsets() qui permet de récupérer les informations de positionnement du canevas (~fenêtre) du navigateur, j'ai ajouter le bout de code (var screenHeightDecal = ...) qui récupère la position du canevas par rapport au haut de la page dans cette fonction, et j'ai modifier la fonction centerOnScreen() pour utiliser cette nouvelle information pour centrer la fenêtre.

Commentaire de XtremDuke le 03/01/2008 16:40:34

Info pour ceux et celles qui utilisent Proto 1.6 : Vous pouvez oublier la fonction getLayoutOffsets() car la derniere version du framework en date possède nativement une fonction permettant de récuperer le viewport (quel soulagement...).

Commentaire de SMaxime le 07/03/2008 11:42:06

Salut !!! D'abord, bravo pour le script. Mais c vrai que si le code était commenté je ne serais pas obligé de faire ce post.

Est-il possible d'utiliser ces boites de dialogues, sans avoir à cliquer sur un bouton ???
Car cela fct très bien avec un clic sur le bouton, mais pas en passant par un alert "normal".

Merci

Commentaire de XtremDuke le 07/03/2008 14:49:56

SMaxime :

Oui biensur, supprime les lignes suivantes :

window.alert = function(msg){
showMsgBox(msg);
}

De ce fait, tu pourras afficher la boite perso par la fonction showMsgBox(msg) quand bon te semblera.

Commentaire de SebMoine le 25/03/2008 22:40:52 10/10

cool ton script
j'ai fait ma personnalisé de message (ou boite de dialogue)
[je m'excuse pour ce doublon] le voici le mien

http://www.javascriptfr.com/codes/MESSAGE-PERSONNALISER_46177.aspx

Commentaire de karimflashmx le 31/05/2008 11:55:11

très bien code parfait mais ca reste une petite chose pour que ce code sera totalement parfait et un génial affaire .
dans mon cas j'ai un formulaire et j'ai utiliser ce code pour la vérification des champs , mais dés que la boite est ouvert je trouve que je peut touchez au champs les modifier même que la cette boite d'alerte est ouvert .
comment faire pour que je désactive l'accé au formulaire lorsque la boite est ouvert.
merci d'avance

Commentaire de XtremDuke le 02/06/2008 09:12:53

Salut karimflashmx,

Comme je l'ai dis plus haut, c'est un simple exemple d'affichage de boite de dialogue. Et ce type de personnalisation n'est pas modale. Pour empecher l'utilisateur de modifier ton formulaire, tu peux utiliser l'objet Form qu'offre Prototype. Tu trouveras certainement ton bonheur à l'adresse suivante :

http://prototypejs.org/api/form/disable

Ciao

Commentaire de karimflashmx le 02/06/2008 10:49:10

merci c'est parfait maintenant ;)

Commentaire de Oumbra le 08/02/2010 19:55:29

Bonjour, tout d'abord exellent script qui fonctionne à la perfection.
Seul petit point noir, je n'arrive pas à le lancer sans a avoir a appuyer (ouf beaucoup de A... ^^) sur un bouton. J'ai bien essayer la méthode que tu as proposer :

"Commentaire de XtremDuke le 07/03/2008 14:49:56
SMaxime :

Oui biensur, supprime les lignes suivantes :

window.alert = function(msg){
showMsgBox(msg);
}

De ce fait, tu pourras afficher la boite perso par la fonction showMsgBox(msg) quand bon te semblera."

Mais hélas sans résultat (ni fenêtre ni message d'erreur...) je ne sais pas comment faire pouvais vous m'expliquer ?

dans mon script je dois afficher une fenêtre avec un contenu différent selon des tests en php.
Mon php fonctionne mais lorsque je fait :

<script type=\"text/javascript\">
alert('<b>Désolé,</b><br/>mot de passe érroné.');
Event.observe(window, 'load', initMsgBox, false);
</script>";

Il m'affiche une vulgaire alert (toute caca !!!) alors qu'avec un bouton :

<script type=\"text/javascript\">
alert('<b>Désolé,</b><br/>mot de passe érroné.');
Event.observe(window, 'load', initMsgBox, false);
</script>";

il m'affiche ma belleUh fenêtre.

Pourriez vous m'expliquer, s'il vous plait ?

Commentaire de Oumbra le 09/02/2010 00:02:57

edit de mon précédent poste:

echo "
<input type=\"button\" value=\"Test\" onclick=\"alert('<b>Désolé,</b><br/>mot de passe érroné.')\" />
<script type=\"text/javascript\">
Event.observe(window, 'load', initMsgBox, false);
</script>";

Je tiens également que le problème de modal peu être 'bidouillé' il suffit d'appliquer les choses suivante :

1. Placer un div en fin de fichier html (juste avant body), cela simule un fond grisé mais rien de base. (mon image 'shadow.png' est une image grise):

<div id="D_FOND" style="display:none;width:100%;height:100%;background:url(images/shadow.png);opacity:0.3;filter:alpha(opacity=30)">
</div>

2. Ajouter les lignes suivantes  'ShowFond();' et 'HideFond();' tel que :

window.alert = function(msg)
{
showMsgBox(msg);
ShowFond();
}

btn.onclick = function()
{
closeMsgBox();
HideFond();
}

3. Placer les fonctions suivantes dans le fichier, cumstomMsgBox.js :

function ShowFond()
{
  var Obj;
  //-- on affiche le fond
  Obj = document.getElementById('D_FOND');
  if( Obj)
{
with( Obj.style)
{
position="absolute";
display="";
left = "0px";
top  = "0px";
}
}

}

function HideFond()
{
var Obj;
Obj = document.getElementById('D_FOND');
if( Obj)
{
with( Obj.style)
{
display="none";
}
}
}

Voila le tour est joué.

Mais j'ai toujours mon problème d'appel de cette fonction :'(.
Je n'arrive à l'appeler que par onClick ...
Dès lors que je fais un simple :

echo "
<script type=\"text/javascript\">
alert('<b>Désolé,</b><br/>mot de passe érroné.');
Event.observe(window, 'load', initMsgBox, false);
</script>";

Cela n'affiche qu'une alert('<b>Désolé,</b><br/>mot de passe érroné.') basique...

Commentaire de Oumbra le 09/02/2010 01:18:37

J'en peux plus je ne trouve pas :'(, j'ai décortiqué les fichiers javasscript mais je ne comprends pas quelle fonction je pourrais appeler directement au lieux de passer par un onclick=alert()...

Commentaire de XtremDuke le 09/02/2010 12:43:57

Salut Oumbra,

Je ne me souviens guère de cette source mais de mémoire, voilà la démarche à suivre :

La ligne suivante : Event.observe(window, 'load', initMsgBox, false);  permet d'initialiser le "moteur" de rendu des boîtes à afficher. Elle ne doit être appellée qu'une fois au chargement de ton document. Il faut placer celle-ci soit à la fin de ton document, soit dans l'entête (balise <header>).
En suite, il ne reste plus qu'à lancer une 'alert()' classique quand bon te sembles.

Donc dans l'ordre : initialiser le rendu au chargement du document via "Event.observe(..." puis lancer une 'alert()' quand tu en as besoin.

Commentaire de Oumbra le 09/02/2010 13:18:06

Bonjour XtremDuke,

Tout d'abord un grand merci pour ton attention car je désespère, je cherche vraiment d'arrache pied (si ça continu j'en aurais plus xD).

Ta solution me permet une chose, ne pas déclarer plusieurs fois : Event.observe(window, 'load', initMsgBox, false); à chaque fois que je fais un bouton pour ouvrir la fenêtre mais celà ne fonctionne toujours pas en appelant directement une alert('blabla'); dans le html au chargement de la page :'(.

Commentaire de Oumbra le 09/02/2010 13:21:53

Voici le bout de code qui me fais #@!? :

echo "
<input type=\"button\" value=\"Test\" onclick=\"alert('<b>Désolé,</b><br/>mot de passe érroné.')\">
<script type=\"text/javascript\">
alert(\"<b>Désolé,</b><br/>mot de passe érroné.\");
</script>";

Je spécifie que lorsque je charge la page l'alert() se lance bien mais sans design ni rien mais lorsque j'appuie sur le bouton miracle ça fonctionne ...

Commentaire de XtremDuke le 09/02/2010 18:58:04

Si tu veux lancer une alert au chargement de ta page, essaie ça :

echo "
<input type=\"button\" value=\"Test\" onclick=\"alert('<b>Désolé,</b><br/>mot de passe érroné.')\">
<script type=\"text/javascript\">
initMsgBox();
alert(\"<b>Désolé,</b><br/>mot de passe érroné.\");
</script>";

Commentaire de Oumbra le 09/02/2010 20:19:22

Ça Fonctionne enfin !!!!!!!!!!!!!

Enfin pas complètement ^^'...

Avec l'amélioration que j'ai cité au-dessus (le grisage du fond) et bien ma fonction de grisage passe dessus ma belleuh fenêtre :(

Je ne sais pas ou placer ma fonction de grisage pour quelle soit affichier avant ma fenêtre.

Pourrais tu m'éclairer ?

Commentaire de Oumbra le 11/02/2010 15:23:55

J'ai enfin trouvé :)

Je vous explique donc comment avoir une boite de dialogue avec un effet modal :)

1. Placer un div en DEBUT de fichier html (JUSTE APRES body), cela simule un fond grisé mais rien de base. (mon image 'shadow.png' est une image grise):

<div id="D_FOND" style="display:none;width:100%;height:100%;background:url(images/shadow.png);opacity:0.3;filter:alpha(opacity=30)">
</div>

2. Ajouter les lignes suivantes  'ShowFond();' et 'HideFond();' tel que :

<!-- dans la fonction initMsgBox() -->
window.alert = function(msg)
{
showMsgBox(msg);
ShowFond();
}

<!-- dans la fonction initMsgBox() -->
btn.onclick = function()
{
closeMsgBox();
HideFond();
}

<!-- dans la fonction showMsgBox(content) -->
$('msgBoxContent').innerHTML = content;
centerOnScreen($('msgBox'));
new Effect.Appear('msgBox',{duration:0.2});
ShowFond();
}

3. Placer les fonctions suivantes dans le fichier, cumstomMsgBox.js :

function ShowFond()
{
  var Obj;
  //-- on affiche le fond
  Obj = document.getElementById('D_FOND');
  if( Obj)
{
with( Obj.style)
{
position="absolute";
display="";
left = "0px";
top  = "0px";
}
}

}

function HideFond()
{
var Obj;
Obj = document.getElementById('D_FOND');
if( Obj)
{
with( Obj.style)
{
display="none";
}
}
}

et voila vous avez désormé une boite de dialogue alert() avec un effet modal !!!
Pour appeler une boite de dialogue sans bouton ou autre évenement de l'utilisateur (click, reload, etc), placez : "Event.observe(window, 'load', initMsgBox, false);" dans le header de la page html et lorsque vous appelez votre boite (moi je le fais lorsque des restriction php sont fausses ou spéciales) et bien il suffit de faire un :
"<script language='javascript'>initMsgBox();alert('Votre message');</script>"

Voilà !!

Je remercie tout particulièrement duke pour son aide :)

Au revoir et a bientot :)

ps: je souhaite savoir s'il est possible de faire la meme chose avec une boite de dialogue prompt()???
N'hésitez pas à m'aiguiller, je fais beaucoup de recherche mais bon un peu d'aide est toujours bien venue :)

Commentaire de leejkd le 25/03/2010 13:17:12

Rien à dire, vous pouvez faire la même chose avec boite confirm et prompt.

Commentaire de slushgood le 27/10/2010 11:17:23

Bonjour je reviens sur se sujet car j'aurais besoin d'un petit coup de main.
voila j'ai une première fenêtre du type Html:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<LINK rel=stylesheet type="text/css" href="include/opac.css">
<title>Microbib Opac - Fiche Document</title>
<link rel="shortcut icon" href="images/icobook.ico" />
<script type="text/javascript" src="include/prototype.js"> </script>
<script type="text/javascript" src="include/window.js"> </script>
<script type="text/javascript" src="include/debug.js"> </script>
<script type="text/javascript" src="include/securite.js"></script>
<script type="text/javascript">
<!--
  var sesPlus = new Array("sestitres","sesauteurs","sonresume");

  function init_msg()
  {
    for(var i=0; i<sesPlus.length; i++)
      if(document.getElementById(sesPlus[i]).style.display == "block")
        document.getElementById(sesPlus[i]).style.display = "none";
  }

  function toggle_msg(n)
  {
    init_msg();
    var id=sesPlus[n];
    document.getElementById(id).style.display = (document.getElementById(id).style.display == "none" ? "block" : "none");
  }

function revenir()
{
  if(LireCookie('affine') == 1) location.replace('affineliste.wco');
  else if(LireCookie('affine') == 2) location.replace('trier.wco');
  else location.replace(LireCookie('recherche'));
}

var support = '<%= detail.document%>';
var numero = '<%= detail.no_exemp %>';


//-->
</script>
</head>
<body onload="lanceTimeout();">


<div class="BIBLIOTHEQUES2">
<ul>
<li><a href="#" onClick="location.replace('opac.wco')"><img src="images_bibliotheque/logo_sfgu_mini.gif" alt="logo" width="177" height="99" align="middle"></a></li>
<li><h1>Le Catalogue Commun</h1></li>
<li><a href="#" onClick="location.replace('opac.wco')">>>Recherche Simple</a></li>
<li><a href="#" onClick="location.replace('opacext.wco')">>>Recherche Etendue</a></li>
<li><a href="#" onClick="location.replace('opac_theme.wco')">>>Recherche par Mot-Matière</a></li>
<li><a href="#" onClick="location.replace('nouveau.wco')">>>Nouveaut&eacute;s</a></li>
<li>         <script language="JavaScript">
<!--
       if(LireCookie(COOKIE_FONC_RESERV)==".T.")
     document.write(espacelecteur());
       //--></script>
<li>         <script type="text/JavaScript">
<!--
if(estConnecte())
document.write(estconnecte()); ;
//--></script>
<li>         <script language="JavaScript">
<!--
         if('<%= multisite %>'==".F.")
document.write(reglements());
       //--></script>

<li> <script language="JavaScript">
<!--
       if(LireCookie(COOKIE_FONC_MULTISITE)==".T.")
     document.write(multisite());
       //--></script>      

</ul>
</div>
  


<div class="MAIN">

<div class="FICHE">
<table width="100%">
      </table>
  <div class="ENTETE"><h2><%=detail.document+" N° "+detail.no_exemp%></h2></div>
  <div class="CONTENU">
    <table>
      <tr>
        <TD ROWSPAN="9" class="SUPPORT">
          <center>
            <%= IIF(!empty(detail.type_docum),"<img src='images/type/" + detail.type_docum + ".gif' valign='top'>","NR") %>
            </center>
          </TD>
        <td valign="top" class="TITRE">Titre principal</td>
        <td valign="top">&nbsp;</td>
        <td class="VALEUR"><%= detail.titre %></td>
        </tr>
      <tr>
        <tr>
          <td valign="top" class="TITRE" >Sous-Titre</td>
          <td valign="top" >&nbsp;</td>
          <td class="VALEUR"><%= detail.soustitre %></td>
          </tr>
      <tr>
        <td valign="top" class="TITRE">Autres Titres</td>
        <td valign="top">&nbsp;</td>
        <td class="VALEUR"><%= detail.autre_tit %></td>
        </tr>
      <tr>
        <td valign="top" class="TITRE">Responsabilit&eacute;</td>
        <td valign="top">&nbsp;</td>
        <td class="VALEUR"><%= detail.auteur %> <%= detail.fonction %></td>
        </tr>
      <tr>
        <td valign="top" class="TITRE">Autres Responsabilit&eacute;s</td>
        <td valign="top">&nbsp;</td>
        <td class="VALEUR"><%= detail.autre_aut %></td>
        </tr>
      <tr>
        <td valign="top" class="TITRE">Editeur/Date d'&eacute;dition</td>
        <td valign="top">&nbsp;</td>
        <td class="VALEUR"><%= detail.editeur %> / <%= detail.annee_ed %></td>
        </tr>
      <tr>
        <td valign="top" class="TITRE">Collection/S&eacute;rie</td>
        <td valign="top">&nbsp;</td>
        <td class="VALEUR"><%= detail.collection %> / <%= detail.serie %></td>
        </tr>
      <tr>
        <td valign="top" class="TITRE">
          <%= IIF((detail.type_docum="V"),"Copyright/Support/Collation",IIF((detail.type_docum="S"),"N°Distributeur/Support/Détails",IIF((detail.type_docum="E"),"ISBN/Support","ISBN/Nb pages/Format"))) %>
          </td>
        <td valign="top">&nbsp;</td>
        <td class="VALEUR">
          <%= IIF((detail.type_docum="V"),detail.copyrigh + " / " + (IIF(detail.support="A","VHS",IIF(detail.support="B","DVD",IIF(detail.support="C","DivX",IIF(detail.support="U","Autre","NR"))))) + " / " + detail.version + " " + detail.couleur +  " " + TRANSFORM(detail.duree) + "minutes",IIF((detail.type_docum="S"),detail.no_distr + " / " + (IIF(detail.support="A","CD Audio",IIF(detail.support="B","K7 Audio",IIF(detail.support="C","DVD Audio",IIF(detail.support="D","Disque vinyl",IIF(detail.support="U","Autre","NR")))))) + " / " + detail.depot_le + " " + detail.type_enr,IIF((detail.type_docum="E"),detail.isbn + " / " + (IIF(detail.support="A","CD-ROM",IIF(detail.support="B","Disquette",IIF(detail.support="C","DVD-ROM",IIF(detail.support="D","Fichier numérique",IIF(detail.support="E","Site Internet",IIF(detail.support="F","Autre",IIF(detail.support="G","Textes-références-périodiques","NR")))))))),detail.isbn +" / " + detail.nb_page + " / " + detail.dimensio))) %>
          </td>
        </tr>
      <tr>
        <td colspan="4" class="INTERLIGNE">Bibliothèque dépositaire de cet exemplaire : <%= detail.ville %></td>
        </tr>
      <TD ROWSPAN="7" class="SUPPORT">
        <center>
          
          <%= IIF(!empty(detail.code_lan),"<img src='images/langue/" + detail.code_lan + ".jpg' valign='top'>","NR") %>
          </center>
        </TD>
        <tr>
          <td valign="top" class="TITRE">Type de document</td>
          <td valign="top">&nbsp;</td>
          <td class="VALEUR"><%= detail.statut%></td>
        </tr>
        <tr>
          <td valign="top" class="TITRE">Disponibilit&eacute;</td>
          <td valign="top">&nbsp;</td>
          <td class="VALEUR"><%= iif(empty(detail.dat_retpre),"Ce document est disponible","<b>Retour prévu le " + dtoc(detail.dat_retpre) + "</b>") %></td>
          
          </tr>
      <tr>
        <td valign="top" class="TITRE">Genre/Public vis&eacute;</td>
        <td valign="top">&nbsp;</td>
        <td class="VALEUR"><%= detail.genre %> / <%= detail.pub_vise %></td>
        </tr>
      <tr>
        <td valign="top" class="TITRE">Localisation/Cote</td>
        <td valign="top">&nbsp;</td>
        <td class="VALEUR"><%= detail.localisati %>/ <%= detail.cote %></td>
        </tr>
      <tr>
        <td valign="top" class="TITRE">Mot(s) mati&egrave;re</td>
        <td valign="top">&nbsp;</td>
        <td class="VALEUR"><%= detail.matiere %></td>
        </tr>
      <tr>
        <td valign="top" class="TITRE">R&eacute;sum&eacute;</td>
        <td valign="top">&nbsp;</td>
        <td class="VALEUR"><%= detail.resume %></tr>
      <tr>
        <td height="1px" colspan="4" ><center>
                                    <hr>
              <script language="JavaScript">

       if(LireCookie(COOKIE_FONC_RESERV)==".T.")
     document.write(lienReservation());
       </script>
            </center>
          </td>
        </tr>
    </table>
  </div>
  <div class="PIED"><a onClick="revenir()"><< Revenir en arrière</a>&nbsp;&nbsp;&nbsp;&nbsp;</div>
</div>

</div>

<div id="content" style="display:none" >
<strong><span style="font-size:16px"> Site où récuperer le livre</span></strong>
<SELECT NAME="site_depot">
  <option value="1">premier
  <option value="2">deuxieme
  <option value="3">troisieme
  <option value="5">quatrieme
  </SELECT>
</div>
</body>
</html>


Ne vous souciez pas trop du contenu mais plutôt des dernières lignes elles font apparaitre une fenêtre Modal avec un menu a choix multiple.

Mon securite.js contient entre autre les infos suivante:
// Méthode site depot   

function openDialog(id) {
  Dialog.alert($(id).innerHTML, {className: "alphacube",  width:300,
okLabel:"Ok",ok: reserver(),
})   
  EcrireCookie(COOKIE_SITE_DEPOT,$('site_depot').getInputs('text'));

  }

Ma fenêtre apparait tout ce passe bien ,
mais voila mon dilemme j'aimerais récupérer dans un cookie "site_depot" le résultat choisi dans ma fenêtre modal ? comment faire ?
merci pour votre aide.

Commentaire de ludojd le 10/03/2011 21:41:42 10/10

très bon travail !

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

Personnalisez javascript Alert '' ; [ par le_m3ellem ] Bonjour tt le monde !SVP ! J'aimerais savoir si on peut personnaliser la boite de dialogue qu'affiche la fonction javascript Alert(): ! la personnalis proprieté d'une classe 'undefined' [ par seb_oulba ] hello, je développe un petit outil pour ka-map (exemple ici : http://maps.dmsolutions.ca/demo/us_streets/iframe.html)afin de faire des requetes lor Empecher les alert() javascript dans une iframe [ par lolpop ] Bonjour,je n'y connais rien en javascript.Mais j'aurais besoin de votre aide.Sur mon site, j'ai une iframe en bas de page ou défile les sites des visi alert [ par diablo2323 ] je veux savoir un scripte qui peut  afficher  une alert lors de fermeture de navigateur afficher un message d'alert [ par corrsland ] Bonsoir à tous !Je suis nouvelle sur ce forum... j'ai découvert le site il y a peu...Je fait actuellement une licence pro Création pour le Web et je d Problème d'envoi de données [ par couicoui ] Bonjour, Je développe un site et j'utilise un XMLhttpRequest pour aller mettre à jour une table de ma base de données. Dans ma fonction javascript qui Changer les libellé des boutons de la boîte de dialogue confirm [ par rodman ] Bonjour à tous et à toutes,est ce que parmi vous tous, quelqu'un serait-il comment on change le libellé des 2 boutons de la boîte de dialogue confirm. Prototype et Array [ par syndrael ] Bonjour, Dans Script.Aculo.us (dernière version) on peut lire les ajouts dans Array. Comme ceci:Object.extend(Array.prototype, {   _each: function(ite fermeture d'une boîte de dialogue d'IE [ par anne13 ] Via un mailto dans un programme, j'envoie le contenu  d'un formulaire sous la forme d'un message outlook. Mon problème, Internet Explorer qui ouvre un sujet formulaire [ par limaseb ] J'ai un probleme sur mon formulaire aimerais le faire apparaitre en email outlook mais en colonne et non en ligne avec entre les informations &amp; ce


Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Février 2012
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
272829    

Consulter la suite du CalendriCode

Photothèque

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 12,589 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales