AJAX DB-Abfrage während der Eingabe

[bce]

hab mich nun ein wenig in die ajax-materie eingefuchst.

habe ein input-feld wo man einen namen eingeben kann. für jeden eingegeben buchstaben wird eine abfrage gestartet.

Code: Alles auswählen

Name:<input name="name" type="text" size="30" maxlength="25" onkeyup="macheRequest();" />

die entsprechende js-datei dazu:

Code: Alles auswählen

    var http_request = false;

    function macheRequest() {

        http_request = false;

        if (window.XMLHttpRequest) { // Mozilla, Safari,...
            http_request = new XMLHttpRequest();
            if (http_request.overrideMimeType) {
                http_request.overrideMimeType('text/xml');
                // zu dieser Zeile siehe weiter unten
            }
        } else if (window.ActiveXObject) { // IE
            try {
                http_request = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    http_request = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e) {}
            }
        }

        if (!http_request) {
            alert('Ende :( Kann keine XMLHTTP-Instanz erzeugen');
            return false;
        }

          if(document.f1.name.value !="")
			  {
			    http_request.open('get', 'suggest.php?name=' + escape(document.f1.name.value.toLowerCase()), true);
			    http_request.onreadystatechange = handleResponse;
			    http_request.send(null);
			  }
			  else
			   {
			    document.getElementById("antwort").style.visibility = "hidden";
			   }
    }
    
	 function handleResponse()
	 {
	  document.getElementById("antwort").style.visibility = "visible";
	  if(http_request.readyState == 4)
		{
		document.getElementById("antwort").innerHTML = http_request.responseText;
		}
	}

/*
 
*/

//zum test
 function uebernehme()
 {
   document.f1.name.value = document.f1.vorschlag.value;
 }

wurde nichts ins feld eingetippt, so erscheint auch nichts. dafür ist folgende zeile verantwortlich:

Code: Alles auswählen

 if(document.f1.name.value !="")

funktioniert soweit alles prima.
nur: wenn man mind. einen suchtreffer hat, so wird da ergebnissfeld "visible". tippt man jetzt einen buchstaben ein, der zu keinem treffer führt, so ist die ergbnissliste leer. diese sollte aber nun besser "invisible" sein.

der aufruf der php-abfrage geschieht ja mittels:

Code: Alles auswählen

http_request.open('get', 'suggest.php?name=' + escape(document.f1.name.value.toLowerCase()), true);

gibt diese zeile ein ergebnis zurück, das abgefragt werden kann?

wie könnte ich das realisieren?
¢¦

[JaneDoe]

wenn ich das richtig sehe (Buchstabe eintippen->Treffer->Liste erscheint->nächster Buchstabe->kein Treffer->Liste verschwindet)
ist das im aktuellen ajax mod doch genau so gelöst.

Vielleicht da mal reinschauen.

[oxpus]

Nun ja, "display:" und "display:none" wären je nach Ergebnis der Abfrage zu steuern.
Also kommt eine Liste zurück oder nicht.
Bei einer leeren Liste ist die Option nicht wieder zu setzen, bzw. zu ändern und damit die Anzeige eben sichtbar bleibt:

Code: Alles auswählen

     if(http_request.readyState == 4) 
      { 
      document.getElementById("antwort").innerHTML = http_request.responseText; 
      }

Hier wird schliesslich einfach eingeschaltet (weiter oben im Script), ohne zu prüfen, ob responceText überhaupt einen Wert hat.
Du kannst das aber auch nachträglich verstecken, also genau an diesem genannten Punkt hier.
Zumal man diese auch immer neu schreiben sollte, um "veraltete" Daten in der Anzeige zu vermeiden

[bce]

danke euch.
habs gelöst, indem ein text ausgegeben wird, dass keine treffer zu diesem suchstring vorhanden sind.

eine andere frage zu auswahlmöglichkeiten ala "input type=radio".

Code: Alles auswählen

eins<input type="radio" name="ms" value="1" checked />  zwei<input type="radio" name="ms" value="2" />  drei<input type="radio" name="ms" value="3" />

(ausgabe siehe angehängtem bild)

wie kann ich den wert was angeklickt wurde im php-skript ermitteln? ¢¦ der php-aufruf in der javascript-datei:

Code: Alles auswählen

http_request.open('get', 'ajax-spielersuche.php?name=' + escape(document.f1.name.value.toLowerCase()), true);

mit

Code: Alles auswählen

$_GET['ms']

gehts nicht, da ja das formular nicht abgesendet wurde.. (da ja kein absende-button geklickt wurde)

in der rar-datei sind die 3 benötigten files

grund der frage: es soll für jedes angeklickte (eins, zwei, drei) eine andere tabelle ausgelesen werden, deshalb muss irgendwie im php-file ein wert vorliegen was geklickt wurde

[oxpus]

PHP kann nur auf die Werte zugreifen, wenn das Formular gesendet wurde.
Ansonsten gehts nur per Javascript und einem Ajax-Aufruf, um den Wert ohne Absenden des Forms an ein PHP-Script zu übergeben.

Halte Dir immer im Hinterkopf, daß PHP auf dem Server, HTML und Javascript (und damit auch AJAX) NUR auf dem Webbrowser des Users ausgeführt werden.
Somit muss man Daten zwischen PHP und der Webseite immer auch transportieren, da PHP nicht auf diese Daten direkt zugreifen kann.
Genau genommen werden auch Daten, die per PHP an den Webbrowser geschickt werden, auch eben geschickt und nicht direkt dargestellt.

Ein kleiner, unscheinbarer aber wichtiger Faktor!

[bce]

ok.

hab mir eine andere lösung gebastelt: und zwar wird der wert der radiobuttons ausgelesen und als parameter an die beim ajax-request aufgerufene php-datei mit angehängt.

folgendes steht nun in der js-datei:

...
var url = 'ajax-spielersuche.php?name=' + escape(document.f1.name.value.toLowerCase()) + '&ms='+radioWert(document.f1.ajax_ms);
http_request.open('get', url , true);
...

//zum ermitteln der radio-buttons

function radioWert(rObj) {
var radio = document.f1.ms;
for (var i=0; i<rObj.length; i++) if (rObj.checked) return rObj.value;
return false;
}

funktioniert nun

[oxpus]

Ja, oder so...