Webseiten container reloaden mit anderem inhalt

09/25/2015 15:45 .Barone#1
Hallo epvpler.
Ich habe in meiner index.php eine <div> die folgendermaßen aussieht:
PHP Code:
<div id='changeContent'style ='width: 100%; height: 100%; position: fixed;margin-top: 12%;'>
</
div
das ist sozusagen der hauptbereich wo alles neu lädt.
->
PHP Code:
$(document).ready(function(){
    $(
'#link').on('click', function(){
    $(
'#changeContent').load('test.php');
    });
}); 
Das klappt soweit wunderbar. In dieser test.php befindet sich jetzt ein Bild, wenn man auf dieses klickt, soll der selbe container (changeContent) nochmal mit einer anderen .php datei geladen werden.
zb
PHP Code:
$(document).ready(function(){
    $(
'#neuerlink').on('click', function(){
    $(
'#changeContent').load('erfolg.php');
    });
}); 
wie kann ich dies am einfachsten und besten realisieren? denn so funktioniert es irgendwie nicht.
09/25/2015 23:11 iProModzZ#2
Such mal nach Ajax, damit sollte das gehen.

Weiß leider gerade keinen genauen Code
09/26/2015 11:07 phlinther1#3
Was genau ist denn der Fehler? Beachte, dass du 'erfolg.php' im richtigen Verzeichnis haben musst ^^ Teste auch, ob das Klick-Event wirklich ausgelöst wird (einfach mit einem alert(); ) und ich nehme an, dass du jQuery auch wirklich eingebunden hast ;D
09/26/2015 13:13 Synatex#4
Du nutzt .on() in dem Kontext falsch. Wenn ein Event ausgelöst wird bubbled es hoch bis zum parent und sollte es nicht abgefangen werden immer höher.

Wenn du es direkt von Anfang an an ein Element bindest welches nicht existiert, kann es nicht funktionieren. Nutze daher entweder einen Parent oder sollte es ein komplett eindeutiges Element sein kannst du auch document benutzen.

PHP Code:
$(document).ready(function(){

  $(
document).on('click','#neuerlink',function(e) {
     $(
'#changeContent').load('erfolg.php');
  });
}); 
09/27/2015 13:28 .Barone#5
Okay. Ich realisiere gerade das ich es so nicht machen kann, sondern das ganze mit Ajax gemacht werden muss. Folgendes ist mein Ziel:
Du klickst auf einen Button -> #changeContent läd dich neu mit inhalt von einer anderen .php datei. In dieser sind mehrere Buttons, welche eine eindeutige ID haben. Klickt man auf einen dieser buttons, soll sich #changeContent erneut laden, mit inhalt der aus einer datenbank geholt wird, bezogen auf diese ID. Nur komm ich gerade nicht mit Ajax klar.
09/27/2015 16:28 .SkyneT.#6
Quote:
Originally Posted by .Barone View Post
Nur komm ich gerade nicht mit Ajax klar.
Hier ein kleines Beispiel, ist eigentlich nicht so kompliziert, denke ich :)
Code:
//fname = dateiname
function loadContentFromFile(fname)
{
   var xmlhttp = new XMLHttpRequest();
   xmlhttp.open("GET", fname, true);
   xmlhttp.onreadystatechange = function()
   {
      if(xmlhttp.readyState == 4 && xmlhttp.status == 200)
      {
          //xmlhttp.responseText kannst du nun irgendwo anzeigen
      }
   }
   xmlhttp.send();
}
09/28/2015 10:07 ComputerBaer#7
Das sieht durch jQuery etwas einfacher aus.
Code:
$('#changeContent').load('test.php', function() {
  // Ab hier sollten deine neuen IDs bekannt sein.
  $('#neuerlink').on('click', function() {
    $('#changeContent').load('erfolg.php');
  }); 
});
[Only registered and activated users can see links. Click Here To Register...]

Das ist jetzt vielleicht noch nicht die schönste Lösung, aber sie sollte erstmal funktionieren. Ich habe es nicht getestet.
09/28/2015 11:18 .Barone#8
Danke nochmal für eure Antworten, werde mich da gleich nochmal ransetzen.
ComputerBaer, das habe ich theoretisch versucht, jedoch hats nicht geklappt. Ist es möglich per jquery einen $_GET wert zu übergeben? denn pro button gibt es ja eine unique ID, die per get übergeben wird.Mit der unique ID wird eine mysqli_query ausgeführt und daten aus der db geholt.
09/28/2015 12:37 .SkyneT.#9
Quote:
Originally Posted by ComputerBaer View Post
Das sieht durch jQuery etwas einfacher aus.
Code:
$('#changeContent').load('test.php', function() {
  // Ab hier sollten deine neuen IDs bekannt sein.
  $('#neuerlink').on('click', function() {
    $('#changeContent').load('erfolg.php');
  }); 
});
[Only registered and activated users can see links. Click Here To Register...]

Das ist jetzt vielleicht noch nicht die schönste Lösung, aber sie sollte erstmal funktionieren. Ich habe es nicht getestet.
Ich wusste das gleich jemand mit jQuery daherkommt, ja es ist hier n bisschen kürzer und vllt auch schöner. Ich bevorzuge jedoch nicht wegen jeder Kleinigkeit jQuery zu verwenden, und schon gar nicht, um etwas zu lernen.
Ich will nur etwas wie das: [Only registered and activated users can see links. Click Here To Register...] vermeiden :D

Aber jedem das seine, beides hat seine Existenzberechtigung, ob man sich mit Librarys und Frameworks eindeckt oder nicht ist jedem selbst überlassen.
09/28/2015 13:22 ComputerBaer#10
Quote:
Originally Posted by .Barone View Post
Ist es möglich per jquery einen $_GET wert zu übergeben?
Klar geht das auch, sieht dann nur wieder etwas anders aus:
[Only registered and activated users can see links. Click Here To Register...]

Quote:
Originally Posted by .SkyneT. View Post
Ich wusste das gleich jemand mit jQuery daherkommt, ja es ist hier n bisschen kürzer und vllt auch schöner.
Ich bin mit jQuery angekommen, weil .Barone bereits jQuery benutzt.
09/28/2015 14:03 .SkyneT.#11
Quote:
Originally Posted by ComputerBaer View Post
Ich bin mit jQuery angekommen, weil .Barone bereits jQuery benutzt.
Das macht natürlich Sinn, keine Ahnung wie ich das übersehen konnte.
In dem Fall kann und soll man natürlich jQuery verwenden :)