mehrere Input Felder abfragen mit AJAX

raven3k

New member
ich versuche derzeit eine AJAX Suche mit PHP zu erstellen (ohne Frameworks)

Soweit läuft diese auch ganz gut, wenn ich bei jedem Input Feld die JS Function aufrufe und den VALUE übergebe.
Beispiel: <input type='text' size='10' name='srch_username' onkeyup='ajax_search(\"username\",this.value)'/>

Ich brauche allerdings von bis zu 8 solchen Input Feldern (Typ: text) den VALUE um diese an eine SQL Abfrage zu hängen.
Sobald das nächste Feld gefüllt wird, ist der erste Wert leer.

Hatte gehofft das es evtl. funktioniert in dem <form ... die JS Funktion aufzurufen, wie etwa onchange='ajax_test();' - bisher jedoch ohne erfolg.
Die JS Funktion würde natürlich dann entsprechend umgewandelt, wenn ich in der JS Funktion die Information aller VALUES hätte.


Code:
    function ajax_search(spalte,suchbegriff) {
        if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlHttp = new XMLHttpRequest();
        } else {// code for IE6, IE5
          xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        } 
        var url = "lib/ajax_search.inc.php";
        var params = spalte+"="+suchbegriff;
        xmlHttp.open("POST", url, true);
        
        //Headerinformationen für den POST Request
        xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xmlHttp.setRequestHeader("Content-length", params.length);
        xmlHttp.setRequestHeader("Connection", "close");
        
        xmlHttp.onreadystatechange=function() {
          if (xmlHttp.readyState==4 && xmlHttp.status==200) {
            document.getElementById("suchergebnis").innerHTML = xmlHttp.responseText;
          }
        }        
        xmlHttp.send(params);
    }


Stehe bestimmt gerade einfach nur auf dem Schlauch und nachher kommt der "Ahja" Effekt :)
 
Zuletzt bearbeitet:
Bin nicht sicher, ob ich das Problem richtig verstanden habe.
Du brauchst beim Request immer das aktuelle Feld und alle davor auf dem Server?
Die gibst du ja durch Konkatination mit & in der Variable params mit. Also einfach Funktion mit einem Schalter aufrufen und je nach Schalter die Felder aneinander ketten.
 
Ich könnte evtl. in der JS Funktion eine schleife durchlaufen lassen, wo ich jedes Input Feld abfrage nach deren VALUE und es dann auch an die AJAX PHP Datei übersende.

Was nur schick wäre, wenn ich beim <form ... > die JS Funktion direkt aufrufen könnte.
 
Das läßt sich z.b. mit jquery in drei Zeilen erledigen, auch der AJAX Code wäre deutlich einfacher und vor allem auch robuster. Dein Ansatz dürfte die bald einige Probleme bereiten.

PHP:
$('input').keyup(function(){
  var val = $(this).val();
  alert(val);
});
 
Bei jedem onkeyup ein AJAX-Request zu starten scheint mir ein wenig Overkill zu sein. Wenn man dann man in die Produktivphase kommst, wirst du damit ziemlich schnell deinen Server überlasten.
Ich würde da auch onchange gehen... oder das onkeyup über einen abbrechbaren Delay handeln.

Zu deinem Problem: du wirst nicht drumrum kommen, da eine Schleife zu machen, die durch alle Elemente durchiteriert

Deinen letzten Satz mit dem "schick wäre" verstehe ich nicht.

PS: ein globales XHR-Objekt... tztztz
 
Zurück
Oben