M
Mr. Snoot
Gast
Hio,
ich spiel derzeit etwas mit Ajax und "(Google) Suggest". Im Großen und Ganzen läuft es auch, ein Problem gibt es aber: bei Eingabe von Umlauten ä, ö, ü, Ä, Ö, Ü oder ß wird kein Treffer zurückgeliefert.
Ich hab schon mit sämtlichen Zeichenkodierungen und PHP-Umwandlungen (htmlspecialchars etc.) rumgespielt, aber es klappt einfach nicht. Hat vielleicht jemand eine Idee, wo es hakt?
Hier mal die Dateien:
Sucheingabe, index.html:
Datenbankabfrage, text.php:
XMLHttpRequest, ajax.js:
Ausgabe mit JS, suggest.js:
ich spiel derzeit etwas mit Ajax und "(Google) Suggest". Im Großen und Ganzen läuft es auch, ein Problem gibt es aber: bei Eingabe von Umlauten ä, ö, ü, Ä, Ö, Ü oder ß wird kein Treffer zurückgeliefert.
Ich hab schon mit sämtlichen Zeichenkodierungen und PHP-Umwandlungen (htmlspecialchars etc.) rumgespielt, aber es klappt einfach nicht. Hat vielleicht jemand eine Idee, wo es hakt?
Hier mal die Dateien:
Sucheingabe, index.html:
HTML:
<html>
<head>
<style type="text/css"><!--
a:link{color:#000;}
a:visited{color:#ff0;}
a:hover{color: red;}
a:active{color:#f00;}
--></style>
</head>
<title>Suggest </title>
<script type="text/javascript" src="ajax.js"></script>
<script type="text/javascript" src="suggest.js"></script>
</head>
<body>
<input type="text" size="20" id="eingabe" onkeyup="load()">
<div id="text">Bitte Suchbegriff eingeben!</div>
</body>
</html>
PHP:
<?php
$eingabe=$_POST["eingabe"];
//Bitte die richtigen Zugangsdaten einfuegen:
$conn = @mysql_connect("localhost", "user", "pwd")
or die("Verbindung zu Datenbank fehlgeschlagen");
//Datenbank auswaehlen:
$rs = @mysql_select_db("db", $conn)
or die("Auswahl der Datenbank fehlgeschlagen");
$liste="";
if (get_magic_quotes_gpc()) $eingabe = stripslashes($eingabe);
$frage = mysql_query("SELECT * FROM table WHERE wert LIKE '%". mysql_real_escape_string($eingabe) ."%';");
while ($antwort=mysql_fetch_array($frage)){
$liste.= '<a href="#">'.$antwort["wert"].'</a><br>';
}
echo $liste;
?>
PHP:
function Ajax() {
//Eigenschaften deklarieren und initialisieren
this.url="";
this.params="";
this.method="GET";
this.onSuccess=null;
this.onError=function (msg) {
alert(msg)
}
}
Ajax.prototype.doRequest=function() {
//Ueberpruefen der Angaben
if (!this.url) {
this.onError("Es wurde kein URL angegeben. Der Request wird abgebrochen.");
return false;
}
if (!this.method) {
this.method="GET";
} else {
this.method=this.method.toUpperCase();
}
//Zugriff auf Klasse fuer readyStateHandler ermoeglichen
var _this = this;
//XMLHttpRequest-Objekt erstellen
var xmlHttpRequest=getXMLHttpRequest();
if (!xmlHttpRequest) {
this.onError("Es konnte kein XMLHttpRequest-Objekt erstellt werden.");
return false;
}
//Fallunterscheidung nach Uebertragungsmethode
switch (this.method) {
case "GET": xmlHttpRequest.open(this.method, this.url+"?"+this.params, true);
xmlHttpRequest.onreadystatechange = readyStateHandler;
xmlHttpRequest.send(null);
break;
case "POST": xmlHttpRequest.open(this.method, this.url, true);
xmlHttpRequest.onreadystatechange = readyStateHandler;
xmlHttpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlHttpRequest.send(this.params);
break;
}
//Private Methode zur Verarbeitung der erhaltenen Daten
function readyStateHandler() {
if (xmlHttpRequest.readyState < 4) {
return false;
}
if (xmlHttpRequest.status == 200 || xmlHttpRequest.status==304) {
if (_this.onSuccess) {
_this.onSuccess(xmlHttpRequest.responseText, xmlHttpRequest.responseXML);
}
} else {
if (_this.onError) {
_this.onError("["+xmlHttpRequest.status+" "+xmlHttpRequest.statusText+"] Es trat ein Fehler bei der Datenbertragung auf.");
}
}
}
}
//Gibt browserunabhaengig ein XMLHttpRequest-Objekt zurueck
function getXMLHttpRequest()
{
if (window.XMLHttpRequest) {
//XMLHttpRequest fuer Firefox, Opera, Safari, ...
return new XMLHttpRequest();
} else
if (window.ActiveXObject) {
try {
//XMLHTTP (neu) fuer Internet Explorer
return new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
try {
//XMLHTTP (alt) fuer Internet Explorer
return new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
return null;
}
}
}
return false;
}
PHP:
//Instanz der Klasse Ajax erzeugen und mit der Datenuebertragung starten
function load()
{
var eingabe=document.getElementById("eingabe").value;
with (new Ajax()){
url="text.php";
method="POST";
params="eingabe="+eingabe;
onSuccess=successHandler;
onError=errorHandler;
doRequest();
}
//Den Text in die Seite einfuegen
function successHandler(txt,xml){
document.getElementById("text").innerHTML=txt;
}
//Fehler
function errorHandler(msg){
document.getElementById("text").innerHTML=msg;
}
}
Zuletzt bearbeitet:
