[AJAX + PHP] Suche für Input Feld

Mc.Alcatraz · 29. Dezember 2006

Also ich habe einen Array z.B. $namen. Nun möchte habe ich ein Inputfeld in das Usernamen eingetragen werden, an diese dann Nachrichten verschickt werden. Da es sehr viele sind möchte ich nun wenn man beginnt einen Namen einzutippen darunetr ein kleines Feld kommt das so maximal 15 Namen anzeigt die mit den jeweiligen Buchstaben beginnen, die möglichen NAmen reduzieren sich natürlcih je mehr man eingibt. Es sollen nur nie mehr als 15 angezeigt werden auch wenn es mehr mit gleichem Anfang gibt. Mit den Pfeiltasten soll man durch die Liste springen können und mit enter wird der ausgewählte Name dann in das input Feld übernommen.

J!0X · 31. Dezember 2006

Das input-tag hat ein Attribut names onkeyup mit dem du eine Funktion beim Loslassen einer Taste aufrufen kannst. Du erstellst also ein PHPscript welches dir die Daten aus einer Datenbank ausliest, und formatierst es mit CSS so, dass es direkt unter dem Textfeld ist. So weit zur Theorie.
Als erstes der AJAX-Teil:

Code:

<head>
<script language="javascript">
var xmlhttp;
function loadxmlobj()
{
	try
	{
		xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
	}
	catch (e)
	{
		try
		{
			xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
		}
		catch (e)
		{
			xmlhttp = null;
		}
	}
	
	if (!xmlhttp && typeof XMLHttpRequest != "undefined")
	{
		xmlhttp = new XMLHttpRequest();
	}
}
function gE(id)
{
	return document.getElementById(id);
}
function XMLRequest(serverFile, objID) {
	var obj = gE(objID);
	xmlhttp.open("GET", serverFile);
	xmlhttp.onreadystatechange = function() 
	{
		if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
			obj.innerHTML = xmlhttp.responseText;
		}
	}
	xmlhttp.send(null);
}
function showNames()
{
        XMLRequest("phpscript.php?entered=" + gE("name").value, "liste");
}
function setName(name)
{
        gE("name").value = name;
}
</script>
</head>
<body onload="javascript:loadxmlobj()">
<input type="text" id="name" value="" onkeyup="javascript:showNames()" /><br />
<div id="liste" style="visibility:hidden"></div>
</body>

So. Als nächstes das PHP-Script.

PHP:

<?php
if(isset($_GET["entered"]))
{
        $result = mysql_query("SELECT name FROM users WHERE name LIKE \"".$_GET["entered"]."\" LIMIT 0,10");
        while($row = mysql_fetch_assoc($result))
        {
                  echo "<a href=\"javascript:setName('".$row["name"]."')\">".$row["name"]."</a>";
        }
}
?>

So üngefähr wirds sein. Habe es nicht getestet

.

hemorieder · 1. Januar 2007

war zwar nich meine frage, aber funzen tut es bei mir nich

ich hab auch die phpscript.php umbenannt. muss ich irgendwie ajax auf dem server installiert haben ?

J!0X · 1. Januar 2007

J!0X schrieb:
So üngefähr wirds sein. Habe es nicht getestet .

AJAXrequests funktionieren nur, wenn die Datei im gleichen Ordner oder in einem Unterordner liegt(Firefox).

Mc.Alcatraz · 2. Januar 2007

mmmh mal ausprobieren, geht nicht gibts noc handere möglichkeiten.

J!0X · 5. Januar 2007

Du wolltest eine Methode mit AJAX. Du könntest es auch mit Flash machen, davon habe ich aber keine Ahnung. Wenn mein Script nicht funktioniert, dann kannst du es ja debuggen. Am besten mal in der Javascript-Konsole vom Firefox nachschauen oder nur das PHP-Script aufrufen.

Mc.Alcatraz · 7. Januar 2007

das einzige problem, is das <body onload=...> kann man das auch woanders als in den body tag machen.

Sgt_H4rtman · 8. Januar 2007

Hi,

Ich habe 2 Dinge an J!0X' Script zu bemängeln, beide sind MSIE spezifisch.
Als erstes ist es unklug das XmlHTTP-Request Objekt zunächst als ActiveX-Objekt erstellen zu wollen. Das Ganze aus zweierlei Gründen:
1. Müssen alle Browser die kein ActiveX unterstützen, und das ist die Mehrzahl, durch die Ganze Fehlerbehandlung durch -> Performancenachteil.
2. Würde der MSIE 7 das ActiveX Modul nutzen anstatt des nativen JavaScript-Objektes, welches er zur Verfügung hat. Dieses ist um ein vielfaches schneller als das ActiveX-Gedöhns.

Der andere Fehler ist auf einen Fehler im MSIE zurückzuführen. Für jeden Request muss im IE das XmlHTTP-Request Objekt neu erstellt werden, da der Browser sonst die Bearbeitung des Scriptes abbricht.

Es ist also klug, die Anweisung loadxmlobj() aus dem onload-Tag herauszunehmen und statt dessen in der Funktion showNames() vor dem Aufruf von XMLRequest() zu platzieren. So sollte das Script dann auch funktionieren.

Ciao

Suche

[AJAX + PHP] Suche für Input Feld

Mc.Alcatraz

Gast

J!0X

Ensign

hemorieder

Lieutenant

J!0X

Ensign

Mc.Alcatraz

Gast

J!0X

Ensign

Mc.Alcatraz

Gast

Sgt_H4rtman

Ensign

Ähnliche Themen