Wie kann ich mit Ajax den Inhalt einer Tabelle in einer BD prüfen?

[HansDerLange]

Hallo,

ich möchte mit Ajax ein eine Datenbanktabelle zugfreifen und abfragen ob bestimmte werte schon vorhanden sind, so dass ich eine liveausgabe erstellen kann ob der wert vorhanden ist oder nicht..

leider bin ich ein absoluter anfänger in bereich Ajax.

mit JavaScript habe ich aber einige Grundkentnisse.

Kennt jemand ein tutorial für so eine kleine Abfrage?

Habe schon selbst im Internet gescuht, aber die Beispiele funktionierten meistens nicht...

danke im voraus!

[Kropff]

ein funktionsfähiges tutorial gibt es z.b. hier

gruß
peter

[HansDerLange]

Habe jetzt ein ganz gutes Beispiel gefungen, wovon ich aber nicht weis ob es funktioniert.. leider habe ich hier noch einige schwierigkeiten bei dem verständniss..

hier das beispiel

function createRequestObject() { 
    var ro; 
    var browser = navigator.appName; 
    if(browser == "Microsoft Internet Explorer"){ 
        ro = new ActiveXObject("Microsoft.XMLHTTP"); 
    }else{ 
        ro = new XMLHttpRequest(); 
    } 
    return ro; 
} 

var http = createRequestObject(); 

function sendReq(url,action) { 
   // open the request 
   // method: get 
   // url + ? + action = youfile.php?para1=var1&so=on 
   // sync or async? async = true, sync = false  
   // check [url]http://www.w3schools.com/xml/xml_http.asp[/url] for additional info 
   http.open('get', url + '?' + action,false); 

   // send it 
   http.send(null); 
      // error handling 
   if (http.status == 200) { 
      // status OK (200), file loaded 
      // return the output 
      return http.responseText; 
   } else { 
      // else return whatever you like. 
      // in this case it's i.e. "Not Found (404)" 
      // or whatever status the request return, 
      return http.statusText + " ("+http.status+")"; 
   } 
} 

das ist der aufrudende teil der funktion:

document.getElementById("hierEinBereichMitEinerId").innerHTML = sendReq("deine php datei.php","ein=" + parameter); 

hier verstehe ich nun nicht wie das ganze mit der php datei zusammenarbeitet.. was muss als parameter übergeben werden und wie bekomme ich dan eine antwort zurück..
und wie muss die php datei aussehen?

danke im voraus!

[Kropff]

mit http.open('get', url + '?' + action,false); übergibt die die gewünschten parameter (action). url ist dein php-script und dort gibts du die werte mit echo aus. return http.responseText; ist nicht so prickelnd, da der ie da gerne schlapp macht. statt dessen return http.respon************ML;.

gruß
peter

[HansDerLange]

Hi Kropff

ich habe das Tutorial auf deiner Seite ausprobiert und den Quellcode runtergeladen.

Im Fire Fox funktioniert es aber im IE nicht...

hast du eine lösung?

[Kropff]

schau ich mir heute abend mal an.

gruß
peter

[Kropff]

Im Fire Fox funktioniert es aber im IE nicht...

doch tut es! wenn du allerdings mit dem ie7 über localhost arbeitest, wird der js-code erst mal geblockt. den mußt du dann freigeben. siehe hinweise oben im browserfenster.

gruß
peter

[HansDerLange]

Hallo,

vielen Dank für die jetzige Hilfe..

allerdings komme ich immer noch nícht zu meiner lösung, bzw. ich weis nicht wie die Herangehensweise ist...

allerdings habe ich schon viel über Ajax gelesen(falls hier welche sagen, ich sollte erst mal die grundlagen lernen)

erst einmal mein genaues problem: Ich habe in einer DB Tabelle mehrere einträge von verschiedenen Datum z.B. 2008-12-10. Der User soll nun durch eine Auswahlliste ein vorgegebendes Datum auswählen und es soll durch Ajax geprüft werden, ob das Datum schon in der DB vorhanden ist und wie oft es vorhanden ist. Wenn es nun mehr als x mal vorhanden ist, soll eine Ausgabe wie "Belegt" ausgegeben werden...

kennt jemand ein tutorial, das genau das tut?


hier ist der Teil in dem das erhaltene Ergeniss verarbeitet werden soll.

//Private Methode zur Verarbeitung der erhaltenen Daten 
  function readyStateHandler()  
  { 
    if (xmlHttpRequest.readyState == 4)  
    { 
      return false; 
    } 
    if (xmlHttpRequest.status == 200)  
    { 
      if (_this.onSuccess)  
      { 
           
      // _this.onSuccess(xmlHttpRequest.responseText, xmlHttpRequest.respon************ML); 
      } 
    }  
    else  
    { 
      if (_this.onError)  
      { 
        _this.onError("["+xmlHttpRequest.status+" "+xmlHttpRequest.statusText+"] Es trat ein Fehler bei der Datenübertragung auf."); 
      } 
    } 
  } 
} 

danke im voraus..

[Kropff]

kennt jemand ein tutorial, das genau das tut?

du meinst, du willst fertigen code?

peter

[HansDerLange]

fertiger code bei dem man versteht wie das funktioniert währe natürlich am besten.. aber die herangehensweise für solch eine abfrage währe auch nicht schlecht..

was meine größte frage ist, was kommt bei der Ajax datei als antwort an? ist das z.b. das komplette Array das ich bei der SQL Abfrage in der PHP Datei erstellt habe??

[Kropff]

ist das z.b. das komplette Array das ich bei der SQL Abfrage in der PHP Datei erstellt habe

entweder lieferst du per php das ergebnis als xml oder als json aus. und das muss dann in der ajax-funktion entsprechend verarbeitet werden.

gruß
peter

[HansDerLange]

habs selbst gebacken bekommen .. danke trotzdem ..

soll ich den code hier posten??

[Kropff]

soll ich den code hier posten??

ich bitte darum.

gruß
peter

[HansDerLange]

Formular "form.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>

<form method="post">

<!--<input id="tag_0" type="text" onkeyup="ladenTag0()">-->


<select id="tag_0" size="1" onClick="ladenTag0()">

     <option value='null'>null</option>
               <option value='2008-01-07'>2008-01-07</option>
               <option value='2008-01-08'>2008-01-08</option>
               <option value='2008-01-09'>2008-01-09</option> 
</select>



</form>

<div id="text">Bitte Suchbegriff eingeben!</div>

</body>
</html> 

Die datei in der die Funktion ladenTag0() aufgerufen wird "suggest.js":

//Instanz der Klasse Ajax erzeugen und mit der Datenübertragung starten
function ladenTag0()
{                

          var datum=document.getElementById("tag_0").value;
        
        with (new Ajax())
        {
            url="http://www.second-radio.de/restzeitenvermarktung/rsh/ajax2/text.php";
            method="POST";
            params="datum="+datum;
            onSuccess=successHandler;
            onError=errorHandler;
            doRequest();
        }
      
      
        //Den Text in die Seite einfügen
        function successHandler(txt,xml)
        {
          document.getElementById("text").innerHTML=txt;      
        }
    
        //Fehler
        function errorHandler(msg)
        {
          document.getElementById("text").innerHTML=msg;
        }

} 

Dies ist die Wichtigste Datei mir allen Ajax Funkrionen... "ajax.js":

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() {
  //Üeberpruefen 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 für readyStateHandler ermöglichen  
  var _this = this;
  
  //XMLHttpRequest-Objekt erstellen
  var xmlHttpRequest=getXMLHttpRequest();
  if (!xmlHttpRequest) {
    this.onError("Es konnte kein XMLHttpRequest-Objekt erstellt werden.");
    return false;
  }
  
  //Fallunterscheidung nach Übertragungsmethode
  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.respon************ML);
      }
    } 
    else 
    {
      if (_this.onError) 
      {
        _this.onError("["+xmlHttpRequest.status+" "+xmlHttpRequest.statusText+"] Es trat ein Fehler bei der Datenübertragung auf.");
      }
    }
  }
}

//Gibt browserunabhängig ein XMLHttpRequest-Objekt zurück
function getXMLHttpRequest() 
{
  if (window.XMLHttpRequest) {
    //XMLHttpRequest für Firefox, Opera, Safari, ...
    return new XMLHttpRequest();
  } else 
  if (window.ActiveXObject) {
    try {   
      //XMLHTTP (neu) für Internet Explorer 
      return new ActiveXObject("Msxml2.XMLHTTP");
    } catch(e) {
      try {        
        //XMLHTTP (alt) für Internet Explorer
        return new ActiveXObject("Microsoft.XMLHTTP");  
      } catch (e) {
        return null;
      }
    }
  }
  return false;
} 

Dies ist die PHP Datei mit der Abfrage "text.php":

<?php 

$datum=$_POST["datum"]; 

// Zugangsdaten für die DB
$dbname = "...";
$dbhost = "...";
$dbuser = "...";
$dbpass = "...";

    $connection = mysql_connect($dbhost,$dbuser,$dbpass) or die("Keine Verbindung möglich: " . mysql_error()."<br />");
    
    //Datenbank auswählen
    $dbDatabase = "...";
    if (!$connection) 
    {
        echo('Verbindung zum Server nicht möglich: ' . mysql_error());  
             die();
    }

    if (!mysql_select_db($dbDatabase, $connection)) 
    {
        echo('Datenbank konnte nicht geöffnet werden: ' . mysql_error());
            die();
    }

mysql_select_db($dbname, $connection); 
//datenbankverbindung ende


// Abfrage bei der Datenbank
    $sql = "SELECT COUNT(datum) as count FROM Tabelle WHERE datum = '".$datum."' GROUP BY datum;";
    
    $query = mysql_query($sql, $connection);
    
    $array = mysql_fetch_assoc($query);
    $anzahlDatum = $array["count"];


    if($anzahlDatum >= 5)
    {
        $ergebnis = "Nicht verf&uuml;gbar";
        echo $ergebnis;
    }
    else
    {
        $ergebnis = "verf&uuml;gbar";
        echo $ergebnis;
    }

   
?>

Der Code ist zum Teil von einem Tutorial und wirde von mit angepasst.

Unter FF funktioniert es.. unter IE leider nicht .. ich weis aber nicht warum.. vielleicht findet Ihr es raus...