Problème d'Injection de modal bootstrap

9 avril 2016 à 18:01:31

Bonjour,

J'ai fait un petit test pour injecter une page html dans un modal bootstrap, ça fonctionne impécable avec Firefox, IE, Safari... mais pas avec google chrome !!!

En effet avec chrome j'obtient une page html opaque sans le modal ... embêtant.

Si quelqu'un a déjà rencontré ce problème j'aimerai savoir comment le résoudre !

Voici le code (qui provient de la doc bootstrap) :

<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="utf-8">
		<link href="bootstrap.css" rel="stylesheet">
		body { padding-top: 20px; }
</style>
</head>
<body>
	<div class="container">
		<div class="btn-group">
			<button id="page1" type="button" class="btn btnprimary">Page 1</button>
			<button id="page3" type="button" class="btn btnprimary">Page 3</button>
		</div>
		<div class="modal fade" id="infos">
		<div class="modal-dialog">
		<div class="modal-content"></div>
		</div>
	</div>
</div>
	<script src="jquery-1.11.2.min.js"></script>
	<script src="bootstrap.min.js"></script>
<script>
	$("body").on("hidden.bs.modal", ".modal", function () {
		$(this).removeData("bs.modal");
	});

	$("#page1").click(function() {
		$("#infos").modal({ remote: "index1.html" } ,"show");
	});

	$("#page3").click(function() {
		$("#infos").modal({ remote: "index3.html" }, "show");
	});
</script>	
</body>
</html>

Petite précision, il n'y a rien de fou dans les pages index1.html et index3.html : juste un texte.

Merci d'avance !

-
Edité par maped 9 avril 2016 à 18:11:35

Vincent-K

9 avril 2016 à 18:09:26

utilise l’élément code du formulaire pour afficher ton code sur le forum stp

maped

20 avril 2016 à 17:06:18

Je me permets de remonter le sujet, c'est bloquant.

Peut-être connaissez-vous d'autres manières d'injecter les modal bootstrap ?

Est-ce que quelqu'un a déjà tester l'injection de modal avec Angular UI ?

Merci d'avance !

bestmomo

20 avril 2016 à 17:36:06

Salut,

Je ne vois pas pourquoi ça ne fonctionnerait pas, quand je teste cet exemple ça va très bien avec la dernière version de Chrome.

maped

20 avril 2016 à 19:53:42

Salut,

Merci pour ta réponse!

En effet cet exemple fonctionne nickel, mais si je copie/colle bêtement dans un éditeur et que je teste (en changeant les dépendances bootstrap...), ça ne fonctionne pas correctement.

Voici le screenshot : on voit bien que le modal est créé en partie mais n'apparaît pas totalement. Une idée ?

bestmomo

20 avril 2016 à 22:00:15

Sans doute parce que tu ouvres pas le fichier dans un serveur mais en mode "file".

VivienAuzou

15 décembre 2017 à 18:37:30

Bonjour,

Je suis en train de tester l'injection de page html avec les fenêtres modales sur mon ordinateur. J'ai le même problème que maped...

Quelle est la solution?

Merci

Lamecarlate

16 décembre 2017 à 8:15:01

VivienAuzou > merci d'ouvrir un nouveau sujet dédié à ton problème plutôt que d'en squatter un

Pas d'aide concernant le code par MP, le forum est là pour ça :)