Inhalt eines Div Containers Dynamisch laden lassen
lima-city → Forum → Programmiersprachen → PHP, MySQL & .htaccess
auslese
bau
betreff
code
date
datenbank
dynamisch nachladen
http
inhalt
kasten
lerneffekt
nachricht
nutz
ordern
situation
status
tab
unsichtbar display
unsichtbar macht
url
-
Hallo Zusammen,
Ich bin gerade dabei mein Nachrichtenverwaltungssystem zu überarbeiten.
Voher lief es so ab: Die Nahcrichten wurden per MySQL ausgelesen und dann per GET Methode angezeigt.
z.B. messages.php?action=show_message&id=3 etc.
Nun Habe ich ich mir eine Tabelle eingerichtet wo der Betreff per Javascript einen zweiten Kasten einblendet. Doch wie erhalte ich dort drin jetzt meine passenden Werte aus der Datenbank?
Bis jetzt bin ich soweit das ich alles Auslesen lasse außer halt den Inhalt der Nachricht und per Mausklick der Kasten eingeblendet wird. Ich denke das es bis jetzt noch nicht Optimal gelöst wurde und bin für jede Hilfe Dankbar hier einmal alles was Benötigt wird:
<div class="row"> <div class="col-lg-12"> <div class="panel panel-primary"> <div class="panel-heading"> <h3 class="panel-title"><i class="fa fa-bar-chart-o"></i> Nachrichten:</h3> </div> <div class="panel-body"> <!-- Nachrichten --> <div class="table-responsive"> <table class="table table-bordered table-hover tablesorter"> <thead> <tr> <th>Von <i class="fa fa-sort"></i></th> <th>Betreff <i class="fa fa-sort"></i></th> <th>E-Mail <i class="fa fa-sort"></i></th> <th>Am <i class="fa fa-sort"></i></th> <th>Status <i class="fa fa-sort"></i></th> </tr> </thead> <tbody> <?php $nachrichten_abfrage = $db->query("SELECT * FROM kontakt ORDER BY id DESC"); while($kontakt_array = $nachrichten_abfrage->fetch_array()){ echo" <tr> <td>" . $kontakt_array['username'] . "</td> <td><span class=\"underline betreff\">" . $kontakt_array['betreff'] . "</span></td> <td>" . $kontakt_array['email'] . "</td> <td>" . $kontakt_array['date'] . "</td> <td>" . $kontakt_array['status'] . "</td> </tr>"; } ?> </tbody> </table> </div> </div> </div> </div> </div><!-- /.row --> <div id="sndbox" class="visible"> <div class="row"> <div class="col-lg-12"> <div class="panel panel-primary"> <div class="panel-heading"> <h3 class="panel-title"><i class="fa fa-bar-chart-o"></i> Nachrichten:</h3> </div> <div class="panel-body"> <!-- Nachrichten Ausgabe --> </div> </div> </div> </div> </div><!-- /.row --> </div><!-- /#page-wrapper --> </div><!-- /#wrapper --> <!-- JavaScript --> <script src="js/jquery-1.10.2.js"></script> <script src="js/bootstrap.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".underline").click(function(){ $("#sndbox").removeClass('visible'); $("#sndbox").addClass('show'); }); }); </script>
Wie erhalte ich jetzt in dem Kasten nur den Inhalt der Nachricht die ich per Betreff Klick ausgewählt habe?
Schön wäre auch noch wenn sich per Klick auf den selben Betreff der Kasten wieder Unsichtbar macht.
LG -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Also dynamisch nachladen kannst du es mittels ajax, da würde ich dir empfehlen auf jQuery zurückzugreifen, da es in meinen Augen leichter und schöner ist. :-)
Natürlich kannst du auch alle Nachrichten direkt laden und quasi mit einer Toggle Funktion diese anfangs unsichtbar (display: none) lassen und durch einen Klick sichtbar machen.
Einfach mal googlen nach javascript oder jquery Toggle und ajax. Kannst dann auch sobald du es selber versucht hast hier posten, dann kann man dir auch weiter helfen. -
gleich etwas fertiges mit lerneffekt:
http://holdirbootstrap.de/javascript/
auf der seite suchst nach 'Interaktive Tabs tab.js'. das wars. (das geht zwar - wie da steht - , nur mit tabs, aber du kannst es gerne auf button o. link weiter ausarbeiten [... habe ich noch was vergessen?]). -
Ansich keine schlechte Idee,
Ich nutze auch ein Bootstrap Administrationsmenü.
Allerdings erschließt sich mir nicht wie ich den Inhalt der Nachrichten beim Switchen der Nachrichten dort reinladen kann. Ich habe hier mal ein ganz kurzes Video was die Situation veranschaulichen soll.
Ich baue noch ein das sich der Nachrichten kasten per Javascript mit einem opacity Effekt ein und ausblendet.
LG -
Hier findest Du ein Beispiel für AJAX unter JQUERY:
http://www.tfonfara.de/ajax-seiteninhalt-laufend-aktualisieren-jquery.xhtml
-
Ah jetzt verstehe ich, Wenn ich jetzt einfach diesen Code da abänder und einen onclick verwende (Für den jeweiligen Betreff) übermittel ich die jeweilige id der Nachricht per AJAX an Refresh.php dort wird dann eine Abfrage der Datenbank durchgeführt die mir den Inhalt anzeigt den ich will. Anschließend wird dann einfach der Nachrichten Bereich mit den Inhalt von Refresh.php neugeladen , nichtwar?
LG -
ja, sollte so klappen
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
