Personnaliser les boîtes de dialogue
Soyez le premier à donner votre avis sur cette source.
Vue 30 346 fois - Téléchargée 3 276 fois
Description
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.
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.
Codes Sources
A voir également
- Javascript boite de dialogue personnalisée
- Popgg - Meilleures réponses
- Boite de dialogue html - Meilleures réponses
- Javascript boîte de dialogue personnalisée - Conseils pratiques - Javascript
- Javascript : Boite de dialogue - CodeS SourceS - Guide
- Javascript : Boite de dialogue (avec grisement de la page) - CodeS SourceS - Guide
- Javascript : Boite de dialogue modale de sélection d'une liste d'icones - CodeS SourceS - Guide
- Boite de dialogue personnalisée ✓ - Forum - VB.NET
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>
<li>[# ]</li>
<li>Le Catalogue Commun
</li>
<li>[# >>Recherche Simple]</li>
<li>[# >>Recherche Etendue]</li>
<li>[# >>Recherche par Mot-Matière]</li>
<li>[# >>Nouveautés]</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>
<%=detail.document+" N° "+detail.no_exemp%>
<center>
<%= IIF(!empty(detail.type_docum),"","NR") %>
</center>,
Titre principal,
,
<%= detail.titre %>,
----
----
Sous-Titre,
,
<%= detail.soustitre %>,
----
Autres Titres,
,
<%= detail.autre_tit %>,
----
Responsabilité,
,
<%= detail.auteur %> <%= detail.fonction %>,
----
Autres Responsabilités,
,
<%= detail.autre_aut %>,
----
Editeur/Date d'édition,
,
<%= detail.editeur %> / <%= detail.annee_ed %>,
----
Collection/Série,
,
<%= detail.collection %> / <%= detail.serie %>,
----
<%= 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"))) %>,
,
<%= 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))) %>,
----
Bibliothèque dépositaire de cet exemplaire : <%= detail.ville %>,
<center>
<%= IIF(!empty(detail.code_lan),"","NR") %>
</center>,
----
Type de document,
,
<%= detail.statut%>,
----
Disponibilité,
,
<%= iif(empty(detail.dat_retpre),"Ce document est disponible","Retour prévu le " + dtoc(detail.dat_retpre) + "") %>,
----
Genre/Public visé,
,
<%= detail.genre %> / <%= detail.pub_vise %>,
----
Localisation/Cote,
,
<%= detail.localisati %>/ <%= detail.cote %>,
----
Mot(s) matière,
,
<%= detail.matiere %>,
----
Résumé,
,
<%= detail.resume %>
----, <center>
<hr>
<script language=\"JavaScript\">
if(LireCookie(COOKIE_FONC_RESERV)==\".T.\")
document.write(lienReservation());
</script>
</center>
</td>
<< Revenir en arrière
Site où récuperer le livre
<SELECT NAME ="site_depot">
<option value="1">premier
<option value="2">deuxieme
<option value="3">troisieme
<option value="5">quatrieme
</SELECT>
</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.
- Messages postés
-
23
- Date d'inscription
- lundi 18 janvier 2010
- Statut
- Membre
- Dernière intervention
- 14 mars 2010
26Je 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):
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 :)
- Messages postés
-
23
- Date d'inscription
- lundi 18 janvier 2010
- Statut
- Membre
- Dernière intervention
- 14 mars 2010
26Enfin 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 ?
Vous n'êtes pas encore membre ?
inscrivez-vous, c'est gratuit et ça prend moins d'une minute !
Les membres obtiennent plus de réponses que les utilisateurs anonymes.
Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.
Le fait d'être membre vous permet d'avoir des options supplémentaires.