AJAX SQL PHP kleine Probleme

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • AJAX SQL PHP kleine Probleme

    Nabend,

    und zwar habe ich ein neues Projekt gestartet und zwar unsere Homepage umbauen.

    Als erstes muss die Rangliste anders werden, und dachte ich direkt an Ajax!

    Ich habe es bisher warscheinlich auf "Newbie" Basis geschafft, ein Onchange zu bauen.

    Ich brauche jedoch folgendes:

    Server 1:Wenn angeklickt lade radio boxen:

    Spieler Rangliste
    Gilden Rangliste
    Reichsrangliste Spieler
    Übersicht-Reichsverteilung

    Server 2:
    Hier genau das selbe


    Wenn eines der Boxen angeklickt

    {Spieler Rangliste,Gilden Rangliste,Reichsrangliste Spieler,Übersicht-Reichsverteilung }

    Dann soll er einen SQL query ausführen und mir das Ergebnis unten in einer Tabelle darstellen.


    Code bisher:

    Meine noobige Ajax.js :

    Quellcode

    1. function loadMenuS1() {
    2. var div = document.getElementById( "s1_spieler_rank");
    3. div.style.display = "block";
    4. var div = document.getElementById( "s1_gilden_rank");
    5. div.style.display = "block";
    6. var div = document.getElementById( "s1_empire_user");
    7. div.style.display = "block";
    8. var div = document.getElementById( "s1_übersicht_empire");
    9. div.style.display = "block";
    10. var div = document.getElementById( "s2_spieler_rank");
    11. div.style.display = "none";
    12. var div = document.getElementById( "s2_gilden_rank");
    13. div.style.display = "none";
    14. var div = document.getElementById( "s2_empire_user");
    15. div.style.display = "none";
    16. var div = document.getElementById( "s2_übersicht_empire");
    17. div.style.display = "none";
    18. }
    19. function loadMenuS2() {
    20. var div = document.getElementById( "s2_spieler_rank");
    21. div.style.display = "block";
    22. var div = document.getElementById( "s2_gilden_rank");
    23. div.style.display = "block";
    24. var div = document.getElementById( "s2_empire_user");
    25. div.style.display = "block";
    26. var div = document.getElementById( "s2_übersicht_empire");
    27. div.style.display = "block";
    28. var div = document.getElementById( "s1_spieler_rank");
    29. div.style.display = "none";
    30. var div = document.getElementById( "s1_gilden_rank");
    31. div.style.display = "none";
    32. var div = document.getElementById( "s1_empire_user");
    33. div.style.display = "none";
    34. var div = document.getElementById( "s1_übersicht_empire");
    35. div.style.display = "none";
    36. }
    Alles anzeigen



    PHP/HTML:

    Quellcode

    1. <?php
    2. class rankfunc {
    3. public function ranking() {
    4. echo '<div id="auswahl">
    5. <h3>Server auswahl:</h3>
    6. <form>
    7. <div id="faeron">
    8. <label>Fearon:</label>
    9. <input type="radio" name="server" value="1" onchange="loadMenuS1();" />
    10. </div>
    11. <div id="s1_spieler_rank">
    12. <label>Spieler Rangliste</label>
    13. <input type="radio" name="s1" value="" /> <!--Muss beim anklicken Tabelle erstellen & SQL Query laden. -->
    14. </div>
    15. <div id="s1_gilden_rank">
    16. <label>Gilden Rangliste</label>
    17. <input type="radio" name="s1" value"" /> <!-- Beim anklicken Zabelle für Gildenrangliste. -->
    18. </div>
    19. <div id="s1_empire_user">
    20. <label>Reichsrangliste Spieler</label>
    21. <input type="radio" name="s1" value="" /> <!-- Listet Reichsrangliste auf -->
    22. </div>
    23. <div id="s1_übersicht_empire">
    24. <label>Übersicht-Reichsverteilung</label>
    25. <input type="radio" name="s1" value="" /> <!-- Listet die Reichsverteilung auf. -->
    26. </div>
    27. <br />
    28. <div id="ascaria">
    29. <label>Ascaria:</label>
    30. <input type="radio" name="server" value="2" onchange="loadMenuS2();" />
    31. </div>
    32. <div id="s2_spieler_rank">
    33. <label>Spieler Rangliste</label>
    34. <input type="radio" name="server2" value="" /> <!-- Muss beim anklicken Tabelle erstellen & SQL Query laden. -->
    35. </div>
    36. <div id="s2_gilden_rank">
    37. <label>Gilden Rangliste</label>
    38. <input type="radio" name="server2" value"" /> <!-- Beim anklicken Zabelle für Gildenrangliste. -->
    39. </div>
    40. <div id="s2_empire_user">
    41. <label>Reichsrangliste Spieler</label>
    42. <input type="radio" name="server2" value="" /> <!-- Listet Reichsrangliste auf. -->
    43. </div>
    44. <div id="s2_übersicht_empire">
    45. <label>Übersichts-Reichsverteilung</label>
    46. <input type="radio" name="server2" value="" /> <!-- Listet die Reichsverteilung auf -->
    47. </div>
    48. </form>
    49. </div>';
    50. }
    51. }
    52. $rankfunc = new rankfunc;
    53. ?>
    Alles anzeigen


    Könnte mir dort bei Jemand zur Seite stehen?

    MFG


    Kann mir dabei evtl einer zur Seite stehen?
  • OT: webmaster-eye.de/JavaScript-ve…erschied.359.artikel.html

    Nehmen wir als Beispiel deine Spieler-Rangliste. Ich nehme an du hast eine Datenbank mit einer Tabelle, die mit den User-Daten gespeichert sind.

    | id | name | points|
    | 1 | Jaffa | 1500 |
    | 2 | Dark | 8410 |
    | 3 | Blub | 3452 |

    In deiner *.php-Datei steht jetzt nun folgendes:

    Quellcode

    1. <?php
    2. if(!$isset($_GET['page]'))
    3. {
    4. die('Fehler');
    5. }
    6. //Wird festgelegt, ob jetzt nun die Plätze von 1 bis 10, 10 bis 20 oder sonst abgerufen werden sollen ;)
    7. $plaetze = $_GET['page'];
    8. //Verbindung zur Datenbank aufbauen
    9. $con = mysql_connect('localhost', 'Name', 'Passwort');
    10. //Hier muss noch eine Fehlerbehandlung hin
    11. //Auswahl der Tabelle mit den Userdaten mit einem Pointer auf unseren ersten Datenbankenaufbau
    12. mysql_select_db('Datenbankname', $con);
    13. //SQL-Abfrage
    14. $sql = 'SELECT id, name, points FROM user_data ORDER BY points DESC LIMIT 1, '.$plaetze;
    15. $result = mysql_query($sql);
    16. //Ausgabe der
    17. while($row = mysql_fetch_array($result))
    18. {
    19. echo 'Name : '.$row['name']. '<br />'.
    20. 'ID : '.$row['id']. '<br />'.
    21. 'Punkte : '.$row['points']. '<br />';
    22. }
    23. //Schließen der Verbindung
    24. mysql_close($con);
    25. ?>
    Alles anzeigen

    Das System sollte eigentlich klar sein ;) Aber vorsicht, UNGETESTET! ;)Und nun die AJAX-Abfrage:

    Quellcode

    1. // from ist der erste Datensatz, von dem ab die nächsten 10 Datensätze ausgegeben werden
    2. // 1 ist hierbei der Default-Wert, wenn kein Wert angegeben wird
    3. function showUser(var from = 1)
    4. {
    5. //IE7+, Firefox, Chrome, Opera, Safari
    6. if(window.XMLHttpRequest)
    7. {
    8. xmlHTTP = new XMLHttpRequest();
    9. }
    10. //IE6 und IE5
    11. else
    12. {
    13. xmlHTTP = new ActiveXObject('Microsoft.XMLHTTP');
    14. }
    15. //Funktion, die jedes mal Aufgerufen wird, wenn sich der Status ändert
    16. //Unserem Objekt wird dadurch die Eigenschaft readyState zugewiesen
    17. xmlHTTP.onreadystatechange = function()
    18. {
    19. if(xmlHTTP.readyState == 4 && xmlHTTP.status == 200)
    20. {
    21. /* readyState:
    22. * 0: request not initialized
    23. * 1: server connection established
    24. * 2: request received
    25. * 3: processing request
    26. * 4: request finished and response is ready
    27. */
    28. //Für status gibt es nur 2 Meldungen. 200 bedeutet 'OK', 404 bedeutet, dass die Seite nicht gefunden wurde
    29. //Response-Text ist der RÜckgabewrt, den der Request liefert
    30. document.getElementById('Deine Div in die, die Table kommen soll').innerHTML = xmlHTTP.responseText;
    31. }
    32. }
    33. //Mit der Art des Request. Daten werden angefordert -> Get
    34. //Danach unsere php-Seite mit der ANgabe, von wo aus die Datensätze ausgegeben werden sollen
    35. xmlhttp.open('GET',"unserePHPseite.php?page="+from,true);
    36. xmlhttp.send();
    37. }
    Alles anzeigen


    Die FUnktion kannst du nun anpassen und überall anwenden, wo du willst. Ich würde dir dennoch empfehlen ein FrameWork wie jQuery zu benutzen, da das wesentlich weniger Code bedeutet und einem viel Arbeit abnimmt.

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von JaffaCoder ()