✔ [Twitter Bootstrap] Modals mit remote?

[Dustin84]

Hallo,

ich bekomme die Modal mit einer Remote-Datei nicht zum laufen, obwohl für mich alles richtig.

Hier die Docs: http://twitter.github.com/bootstrap/javascript.html#modals
Ich verwende die bootstrap-modal.js v2.2.2: https://raw.github.com/twitter/bootstrap/master/js/bootstrap-modal.js

Hier mein Aufruf:

<a href="/php/remote.php" data-target="#myModal" data-toggle="modal">Launch demo modal</a>

Und hier meine remote.php:

<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">Modal Test Header</h3>
  </div>
  <div class="modal-body">
    <p>One fine body…</p>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary">Save changes</button>
  </div>
</div>

Laut der Doku sollte das so gehen. Ist das ein Bug oder fehlt mir noch irgendwas?
Es tut sich gar nichts. Die remote.php wird auch nicht geladen, zumindest sagt das Firebug.

Gruß
D.

 

[ikosaeder]

Hm, was mich stutzig macht, deine remote.php enthält ausschließlich html code.
Musst du vielleicht die Bootstrap.js mit in deine remote.php mit einbinden?

 

[Dustin84]

Ne, das ist nicht nötig.

 

[ikosaeder]

Wie ist denn der tatsächliche Pfad zur remote.php?
Lass mal den / am Anfang weg.
Also

<a href="php/remote.php"

statt

<a href="/php/remote.php"

 

[Dustin84]

Hey,

ich habe jetzt ein wenig rumgetestet und die remote.php bzw der Pfad ist schon ok.
Kann jemand evtl. mal ein komplettes Beispiel posten?

So, hier mein neuer Code, der auch nicht geht! Aber er muss! Langsam #?!%"/& ...

Aufruf von irgendeiner Seite:

<button type="button" data-toggle="modal" data-target="#modallogin">Login</button>

Modal Javascript:

	// Modals
	// -------------------------	
	$("[data-toggle=modal]").click(function() {
		$('#modallogin').modal({
			backdrop: false,
			remote: '/php/remote.php',
			keyboard: false,
			show: true
		});
	});

Das ist doch so richtig! Oder bin ich gerade komplett blöde? ;-)

 

[rd4eva]

Du machst da Grundlegend etwas falsch.

Schau mal was hier steht:

If a remote url is provided, content will be loaded via jQuery's load method and injected into the .modal-body. If you're using the data api, you may alternatively use the href tag to specify the remote source. An example of this is shown below:

Das bedeutet das nicht die gesamte Box geladen wird sodern lediglich der Inhalt der am Ende in .modal-body landet.
Die Box musst du immer noch lokal definieren.

index.html

<a data-toggle="modal" href="php/remote.php" data-target="#myModal" >Launch demo modal</a>

<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
			<h3 id="myModalLabel">Modal Test Header</h3>
		  </div>
		  <div class="modal-body">
			<p>One fine body…</p>
		  </div>
		  <div class="modal-footer">
			<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
			<button class="btn btn-primary">Save changes</button>
		  </div>
		</div>

Die remote.php enthält dann das was anstatt "<p>One fine body…</p>" angezeigt werden soll.

 

[ikosaeder]

Und ich bin mir nach wie vor sicher, das remote: '/php/remote.php', falsch ist.
Hast du ssh Zugriff auf den Server?

 

[rd4eva]

Wie willst du dir denn da sicher sein?
Wenns der Ordner php im DocumentRoot liegt ist das doch ok.
In meinem Beispiel war das nicht der Fall deswegen hab ich den / weg gelassen.

 

[Dustin84]

Heyho,
die remote.php wird schon geladen. Dass sehe ich ja im Firebug

@rd4eva
Ja so hatte ich mir das auch schon gedacht.

Aber ich finde die Lösung von Bootstrap nicht so praktisch, da ich ja immer einen Teil der Modalbox auf meiner Seite haben muss, was dann durch display:none; ausgeblendet wird. Dann kann ich auf meiner Seite auch gleich die komplette Modalbox+Inhalt setzen.

Ich dachte nur, dass die Modalbox komplett von der remote.php geholt wird...

 

[ikosaeder]

Heyho, in deinem ersten Post stand drin, das die remote.php eben nicht geladen wird:

Es tut sich gar nichts. Die remote.php wird auch nicht geladen, zumindest sagt das Firebug.

Das war etwas verwirrend.