Discussion :

[DJYAM'S]

Voici qu'en tant que novice en js, j'essaie de mettre en oeuvre un popup expliqué brièvement sur ce lien: https://ethaizone.github.io/Bootstra...rmation/#usage.

Le problème c'est que je ne m’en sors pas pour le mettre en oeuvre côté javascript.

Quelqu'un peut-il m'aider à réaliser cela? Ou du mois m'expliquer unpeu plus cmt fabriquer ce script js

[hotcryx]

Code :

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

1
2
3
 
var code = '<div>My popup</div>';
$('<div class="boxShadow" style="z-index:1000"></div>').dialog({ modal:true, my:'center', at:'center', resizable:false, draggable:false, of:window, width:500, height:200, title:'Popup' }).html(code);

C'est une modal box.
Ici c'est en jquery classic sans bootstrap, je viens de le faire c'est tout frais

Rem: tu peux changer les options (draggable, resizable à true)...
Le body de ta page doit avoir un z-index < 1000.

Rem2: je viens de regarder ton lien bootstrap, c'est exactement la même chose sauf que c'est plus joli et plus simple lors de l'appel.
A mon avis tu dois remplacer l'instruction $() ci-dessus par $('#...') équivalent du bootstrap.

Inspecte l'élément de la page avec F12 du browser pour voir le code, l'appel, les css.
Il faut déjà que ton bootstrap soit appelé correctement dans ta page avec jquery (load des lib js et css).
Regarde la page d'intro bootstrap pour cela.

[DJYAM'S]

Désolé de le dire mais pour commencer je ne sais pas ce que c'est. Est-ce du js ou du css? Ensuite comment utiliser ça dans mon code. Bref je ne sais pas quoi en faire pour que sa me soit utile. Je ss peut être trop nul

[hotcryx]

La route est longue pour toi mais en quelques jours tu peux faire l'exemple que j'ai indiqué ci-dessous, courage, on est tous passé par là

Tout ce qui commence par $() => c'est du jquery (=js (javascript) amélioré, une librairie), c'est d'ailleur une abréviation pour jquery. Tu peux aussi l'écrire comme suit Jquery().
Bootstrap = CSS = style, décorations améliorée pour rendre beaux.

Donc jquery c'est du javascript et bootstrap ce sont des stylesheets (css) à la base, rien de sorcier mais tu dois d'abord comprendre c'est quoi du javascript, des css et du html.

Commence d'abord par savoir comment créer une simple page html sans code javascript.
(je te conseille le site w3school mais tu as peut-être des tutos de bases ici)

Commence par une page simple avec du texte, ensuite regarde comment ajouter un button, ensuite regarde en javascript comment faire le onclick du bouton et afficher une messagebox (alert) avec un message. Ensuite ajoute un peu de css pour faire par exemple un bouton avec un fond bleu. Change la fonte de ta page, écrits en gras (bold) et des tailles différentes par exemple en Arial et en Courrier. Une fois que tout fonctionne remplace l'appel du onclick par du jquery (regarde juste le onclick event). Ensuite remplace le css par bootstrap, remplace simplement le bouton par un bouton boostrap. Ensuite passe à la modal box jquery que j'ai ajouté et ensuite essaye de le faire en bootstrap.

Ce n'est pas compliqué si tu te limites à l'exemple.
Tu auras compris beaucoup de choses.
Tout est sur w3school.

Attention que javascript est "case sensitive".

[DJYAM'S]

Je connais ce que c'est jquery, bootstrap, html... Je fais déjà mes débuts en développement web mais j'avais pas encore vu du js comme le votre.
Maintenant est ce que vous voulez me dire comment mettre en oeuvre votre modal dialog?

[hotcryx]

Arrête de troller!
Jquery = javascript
Tu prends le code et tu le copies dans une fonction javascript.

[ABCIWEB]

Enfin pour que le code donné en exemple fonctionne cela demande évidemment de charger jquery et jquery.ui, si ce n'est pas déjà fait.