Durch onclick Werte in Datenbank übergeben

Ich habe oben nun mal einen Text leeren hinzugefügt, der in der DB alle aktiv auf 0 setzt.
Diese kannst Du durch ein Image ersetzen wenn Du willst.
Wichtig ist dabei das es dabei die id="leeren" hat, denn darauf reagiert das OnClick.
(Kannst DU natürlich umbenennen, dann aber auch im JS Teil).
Ich poste nun noch mal, wie es momentan bei mir ist,
wo auch funktioniert, das er die Farben entsprechend setzt, wenn man die Seite neu lädt.
HTML & JS Teil da ich dies nicht getrennt habe, zum testen:
HTML:
<html>
    <head>
        <title>Test</title>
        <script src="http://code.jquery.com/jquery-latest.js"></script>

    </head>
    <body>
        <table width="90%" border="1">
          <tr>
              <td colspan="7" style="color:black; text-align:right; font-size:12px;" height="30px">
                  Zahlen entfernen <span id="leeren" class="glyphicon glyphicon-trash" style="color:red;">Leeren</span></a>
              </td>
          </tr>
          <tr>
            <td class="td_ent" id="Zahl1" data-highlight="1">1</td>
            <td class="td_ent" id="Zahl2" data-highlight="2">2</td>
            <td class="td_ent" id="Zahl3" data-highlight="3">3</td>
            <td class="td_ent" id="Zahl4" data-highlight="4">4</td>
            <td class="td_ent" id="Zahl5" data-highlight="5">5</td>
            <td class="td_ent" id="Zahl6" data-highlight="6">6</td>
            <td class="td_ent" id="Zahl7" data-highlight="7">7</td>
          </tr>
        </table>
    </body>

    <script type="text/javascript">
    $( document ).ready(function() {
        //Ajax beim Seite laden
        $.ajax({
        type: "POST",
            url: "test.php",
            data: {
                load: 1
            },
            dataType: 'json',
            cache: false,
            success: function(content) {
                var cnt = Object.keys(content).length;
                while(cnt > 0){
                    cnt = cnt -1;
                    if(content[cnt].aktiv == 1){
                        $('[data-highlight='+content[cnt].lottozahl+']').css('backgroundColor', "rgb(255, 255, 255)");
                    }else{
                        $('[data-highlight='+content[cnt].lottozahl+']').css('backgroundColor', "rgb(192, 192, 192)");
                    }
                }
            }
        });

        //Ajax für DB Eintrag
        $('#leeren').on('click', function() {
            $.ajax({
            type: "POST",
                url: "test.php",
                data: {
                    load: 2
                },
                success: function(content) {
                    location.reload();
                }
            });
        });

        //Klick auf Zelle dieses ausführen
        $('.td_ent').on('click', function() {
            var bgcolor = $(this).css('backgroundColor');
            var lottozahl = $(this).data("highlight");
            var aktiv = 0;

            //Farbwechsel
            if(bgcolor === 'rgb(192, 192, 192)'){
                $(this).css('backgroundColor', "rgb(255, 255, 255)");
                aktiv = 1;
            }else{
                $(this).css('backgroundColor', "rgb(192, 192, 192)");
                aktiv = 0;
            }

            //Ajax für DB Eintrag
            $.ajax({
            type: "POST",
                url: "test.php",
                data: {
                    aktiv: aktiv,
                    lottozahl: lottozahl
                },
                success: function(content) {
                }
            });
        });
    });
    </script>
</html>
der PHP-Teil:
PHP:
<?php
$mysqli = new mysqli("localhost", "root", "root", "testen");
if ($mysqli->connect_errno) {
    die("Verbindung fehlgeschlagen: " . $mysqli->connect_error);
}

if (isset($_POST["load"]) && !empty($_POST["load"])) $load = $_POST["load"];

if($load == 1){
    $sql = "SELECT lottozahl, aktiv FROM lottozahlen";
    $statement = $mysqli->prepare($sql);
    $statement->execute();
    $result = $statement->get_result();
    $i=0;
    while($row = $result->fetch_object()) {
        $array_ergebnis[$i]['lottozahl'] = "$row->lottozahl";
        $array_ergebnis[$i]['aktiv'] = "$row->aktiv";
        $i++;
    }
    echo json_encode($array_ergebnis);
    exit();
}elseif($load == 2){
    $sql = "UPDATE lottozahlen SET aktiv = 0";
    $statement = $mysqli->prepare($sql);
    if(!$statement->execute()) {
      echo "Query fehlgeschlagen: ".$statement->error;
    }
    exit();
}else{
    $sql = "UPDATE lottozahlen SET aktiv = ? WHERE lottozahl = ?";
    $statement = $mysqli->prepare($sql);
    $statement->bind_param('si', $aktiv, $lottozahl);
    $aktiv = $_POST['aktiv'];
    $lottozahl = $_POST['lottozahl'];
    if(!$statement->execute()) {
      echo "Query fehlgeschlagen: ".$statement->error;
    }
}
Hier hat sich einiges geändert. Vor allem die Variable $load hat nun verschiedene Werte,
damit per Ajax das richtige angesprungen wird. (load:1 beim Seite laden, load:2 bei alles leeren).
Wenn load nicht gesetzt wird springt er in den else Teil, was dafür zuständig ist, beim Zellen klick die Farbe zu setzen, und den Eintrag in die DB zu machen, damit bei einem reload oder auch wenn man die Seite später aufruft, die Felder so weiterhin markiert sind.
 
Hi Heiko,

auf http://www.küchenstudio-silberschlag.de/lotto/bearbeiten.php kannst Du wunderbar sehen, dass es soweit funktioniert..

Wenn Du Zahlen anklickst, wird der Hintergrund grau und es wird korrekt in die Datenbank übertragen.
Aber wenn Du die Seite komplett neu startest, oder morgen nachsehen willst, welche Zahlen deaktiviert sind,
wirst Du sehen, dass die Hintergründe nicht mehr grau sind.

Ich habe unten mal ein ECHO ausgegeben, damit man zumindest sieht, welche Zahlen aktiv sind, und welche nicht..
Aber in der Tabelle kann man es nicht ersehen..
 
Kein Problem, ich schaue ja öfter am Tag hier rein.
Zu Deinem Problem von der Seite http://www.küchenstudio-silberschlag.de/lotto/bearbeiten.php
ich habe es mir im Debug angeschaut (F12 bei den meisten Browsern).
beim laden der Seite verursacht die test.php einen error, und kann deswegen die Werte nicht anzeigen.
was genau da drin nun nicht stimmt, kann ich so nicht sagen.
Aber ich denke irgendwas mit der DB-Abfrage stimmt da nicht.
Im Anhang 2 Bilder wo man es erkennen kann.
test_error1.png test_error2.png
Dies müsstest Du mal kontrollieren, als Antwort müsste sowas kommen:
test_error3.png

Was mir noch aufgefallen ist:
data-highlight="1" die Zahl darf nicht öfter vorkommen.
Du verwendest diese bei Lottozahlen und Superzahlen.
Bei Superzahlen am besten was anders nehmen, z.B. data-highlight="101" für 1 data-highlight="102" für 2 oder so.
 
HI Heiko,

Ich habe die test.php nochmals erstellt und alles entfernt, was nicht mit unserem Problem zu tun hat.
Dann habe ich Dein letztes Script und den die gesamte HTML übernommen.
Jetzt dürften zumindest keine Fehler mehr angezeigt werden.
Dennoch funktioniert es immer noch nicht mit der Select.

Ich übergebe Dir jetzt nochmals alle Daten..

Die Datenbank:
Tabelle -> Lottozahlen
Spalten -> id, lottozahl, aktiv

db-strucktur:
strucktur.png


Das PHP-Script:

PHP:
<?php
$mysqli = new mysqli(****);

if ($mysqli->connect_errno) {
    die("Verbindung fehlgeschlagen: " . $mysqli->connect_error);
}

if (isset($_POST["load"]) && !empty($_POST["load"])) $load = $_POST["load"];

if($load == 1){
    $sql = "SELECT lottozahl, aktiv FROM lottozahlen";
    $statement = $mysqli->prepare($sql);
    $statement->execute();
    $result = $statement->get_result();
    $i=0;
    while($row = $result->fetch_object()) {
        $array_ergebnis[$i]['lottozahl'] = "$row->lottozahl";
        $array_ergebnis[$i]['aktiv'] = "$row->aktiv";
        $i++;
    }
    echo json_encode($array_ergebnis);
    exit();
}elseif($load == 2){
    $sql = "UPDATE lottozahlen SET aktiv = 1";
    $statement = $mysqli->prepare($sql);
    if(!$statement->execute()) {
      echo "Query fehlgeschlagen: ".$statement->error;
    }
    exit();
}else{
    $sql = "UPDATE lottozahlen SET aktiv = ? WHERE lottozahl = ?";
    $statement = $mysqli->prepare($sql);
    $statement->bind_param('si', $aktiv, $lottozahl);
    $aktiv = $_POST['aktiv'];
    $lottozahl = $_POST['lottozahl'];
    if(!$statement->execute()) {
      echo "Query fehlgeschlagen: ".$statement->error;
    }
}
?>

HTML:
HTML:
<html>
    <head>
        <title>Test</title>
        <script src="http://code.jquery.com/jquery-latest.js"></script>
<style>

td { text-align:center; }

</style>
    </head>
    <body>
    <br /><br />
        <table width="20%" border="1" align="center">
          <tr>
              <td colspan="7" style="color:black; text-align:right; font-size:12px;" height="30px">
                  Zahlen entfernen <span id="leeren" class="glyphicon glyphicon-trash" style="color:red;">Leeren</span></a>
              </td>
          </tr>
          <tr>
            <td class="td_ent" id="Zahl1" data-highlight="1">1</td>
            <td class="td_ent" id="Zahl2" data-highlight="2">2</td>
            <td class="td_ent" id="Zahl3" data-highlight="3">3</td>
            <td class="td_ent" id="Zahl4" data-highlight="4">4</td>
            <td class="td_ent" id="Zahl5" data-highlight="5">5</td>
            <td class="td_ent" id="Zahl6" data-highlight="6">6</td>
            <td class="td_ent" id="Zahl7" data-highlight="7">7</td>
          </tr>
          <tr>
            <td class="td_ent" id="Zahl8" data-highlight="8">8</td>
            <td class="td_ent" id="Zahl9" data-highlight="9">9</td>
            <td class="td_ent" id="Zahl10" data-highlight="10">10</td>
            <td class="td_ent" id="Zahl11" data-highlight="11">11</td>
            <td class="td_ent" id="Zahl12" data-highlight="12">12</td>
            <td class="td_ent" id="Zahl13" data-highlight="13">13</td>
            <td class="td_ent" id="Zahl14" data-highlight="14">14</td>
            </tr>
          <tr>
            <td class="td_ent" id="Zahl15" data-highlight="15">15</td>
            <td class="td_ent" id="Zahl16" data-highlight="16">16</td>
            <td class="td_ent" id="Zahl17" data-highlight="17">17</td>
            <td class="td_ent" id="Zahl18" data-highlight="18">18</td>
            <td class="td_ent" id="Zahl19" data-highlight="19">19</td>
            <td class="td_ent" id="Zahl20" data-highlight="20">20</td>
            <td class="td_ent" id="Zahl21" data-highlight="21">21</td>
            </tr>
          <tr>
            <td class="td_ent" id="Zahl22" data-highlight="22">22</td>
            <td class="td_ent" id="Zahl23" data-highlight="23">23</td>
            <td class="td_ent" id="Zahl24" data-highlight="24">24</td>
            <td class="td_ent" id="Zahl25" data-highlight="25">25</td>
            <td class="td_ent" id="Zahl26" data-highlight="26">26</td>
            <td class="td_ent" id="Zahl27" data-highlight="27">27</td>
            <td class="td_ent" id="Zahl28" data-highlight="28">28</td>
            </tr>
          <tr>
            <td class="td_ent" id="Zahl29" data-highlight="29">29</td>
            <td class="td_ent" id="Zahl30" data-highlight="30">30</td>
            <td class="td_ent" id="Zahl31" data-highlight="31">31</td>
            <td class="td_ent" id="Zahl32" data-highlight="32">32</td>
            <td class="td_ent" id="Zahl33" data-highlight="33">33</td>
            <td class="td_ent" id="Zahl34" data-highlight="34">34</td>
            <td class="td_ent" id="Zahl35" data-highlight="35">35</td>
            </tr>
          <tr>
            <td class="td_ent" id="Zahl36" data-highlight="36">36</td>
            <td class="td_ent" id="Zahl37" data-highlight="37">37</td>
            <td class="td_ent" id="Zahl38" data-highlight="38">38</td>
            <td class="td_ent" id="Zahl39" data-highlight="39">39</td>
            <td class="td_ent" id="Zahl40" data-highlight="40">40</td>
            <td class="td_ent" id="Zahl41" data-highlight="41">41</td>
            <td class="td_ent" id="Zahl42" data-highlight="42">42</td>
            </tr>
          <tr>
            <td class="td_ent" id="Zahl43" data-highlight="43">43</td>
            <td class="td_ent" id="Zahl44" data-highlight="44">44</td>
            <td class="td_ent" id="Zahl45" data-highlight="45">45</td>
            <td class="td_ent" id="Zahl46" data-highlight="46">46</td>
            <td class="td_ent" id="Zahl47" data-highlight="47">47</td>
            <td class="td_ent" id="Zahl48" data-highlight="48">48</td>
            <td class="td_ent" id="Zahl49" data-highlight="49">49</td>
</tr>
        </table>
</body>
</html>
Das Script:
Code:
    <script type="text/javascript">
    $( document ).ready(function() {
        //Ajax beim Seite laden
        $.ajax({
        type: "POST",
            url: "test.php",
            data: {
                load: 1
            },
            dataType: 'json',
            cache: false,
            success: function(content) {
                var cnt = Object.keys(content).length;
                while(cnt > 0){
                    cnt = cnt -1;
                    if(content[cnt].aktiv == 1){
                        $('[data-highlight='+content[cnt].lottozahl+']').css('backgroundColor', "rgb(255, 255, 255)");
                    }else{
                        $('[data-highlight='+content[cnt].lottozahl+']').css('backgroundColor', "rgb(192, 192, 192)");
                    }
                }
            }
        });

        //Ajax für DB Eintrag
        $('#leeren').on('click', function() {
            $.ajax({
            type: "POST",
                url: "test.php",
                data: {
                    load: 2
                },
                success: function(content) {
                    location.reload();
                }
            });
        });

        //Klick auf Zelle dieses ausführen
        $('.td_ent').on('click', function() {
            var bgcolor = $(this).css('backgroundColor');
            var lottozahl = $(this).data("highlight");
            var aktiv = 0;

            //Farbwechsel
            if(bgcolor === 'rgb(192, 192, 192)'){
                $(this).css('backgroundColor', "rgb(255, 255, 255)");
                aktiv = 1;
            }else{
                $(this).css('backgroundColor', "rgb(192, 192, 192)");
                aktiv = 0;
            }

            //Ajax für DB Eintrag
            $.ajax({
            type: "POST",
                url: "test.php",
                data: {
                    aktiv: aktiv,
                    lottozahl: lottozahl
                },
                success: function(content) {
                }
            });
        });
    });
    </script>

Ich habe die 7-er Tabelle auf 49 erweitert und im PHP-Script unter
PHP:
<?php
$sql = "UPDATE lottozahlen SET aktiv = 1";
?>
aktiv auf "1" gesetzt.
Somit werden beim "löschen" alle Zahlen wieder aktiv.. Macht mehr Sinn, oder ?

Hast Du denn Dein Model, welches ich mir ansehen kann ? Funktioniert es denn bei Dir ?

hier leider nicht..
http://www.küchenstudio-silberschlag.de/lotto/test.php
 
Zuletzt bearbeitet von einem Moderator:
Bearbeite bitte Dein Post, man kann den DB-Zugang erkennen.
ich kopiere mir nacher mal alles so wie du es hast auf meinen Server
 
...besser gleich die Zugangsdaten ändern, Google ist schnell (und in der Zeit haben es sicher schon einige Menschen auch gesehen)
 
Das ist noch besser, könntest Du ein Export dieser Tabelle anhängen, dann brauche ich die nicht komplett selber schreiben.
Ich werden dann ein Funktionierendes Beispiel mal Online stellen.
Währe super.
 
Ich habe mir mal schnell einen Free Account bei Lima-City erstellt,
und Deine Daten hochgeladen.
Ich habe zusätzlich noch die jquery runtergeladen und lokal eingebunden.
https://derkleene1.lima-city.de/lottozahlen.php

dort funktioniert es.
auf den Server sind nun folgende Dateien, mit folgenden Inhalt:
ajax_lottozahlen.php:
PHP:
<?php
$mysqli = new mysqli("derkleene1.lima-db.de", "***", "***", "***");

if ($mysqli->connect_errno) {
    die("Verbindung fehlgeschlagen: " . $mysqli->connect_error);
}

if (isset($_POST["load"]) && !empty($_POST["load"])) $load = $_POST["load"]; else $load = "";

if($load == 1){
    $sql = "SELECT lottozahl, aktiv FROM lottozahlen";
    $statement = $mysqli->prepare($sql);
    $statement->execute();
    $result = $statement->get_result();
    $i=0;
    while($row = $result->fetch_object()) {
        $array_ergebnis[$i]['lottozahl'] = "$row->lottozahl";
        $array_ergebnis[$i]['aktiv'] = "$row->aktiv";
        $i++;
    }
    echo json_encode($array_ergebnis);
    exit();
}elseif($load == 2){
    $sql = "UPDATE lottozahlen SET aktiv = 1";
    $statement = $mysqli->prepare($sql);
    if(!$statement->execute()) {
      echo "Query fehlgeschlagen: ".$statement->error;
    }
    exit();
}else{
    $sql = "UPDATE lottozahlen SET aktiv = ? WHERE lottozahl = ?";
    $statement = $mysqli->prepare($sql);
    $statement->bind_param('si', $aktiv, $lottozahl);
    $aktiv = $_POST['aktiv'];
    $lottozahl = $_POST['lottozahl'];
    if(!$statement->execute()) {
      echo "Query fehlgeschlagen: ".$statement->error;
    }
}
?>
lottotzahlen.js:
Code:
$( document ).ready(function() {
    //Ajax beim Seite laden
    $.ajax({
    type: "POST",
        url: "ajax_lottozahlen.php",
        data: {
            load: 1
        },
        dataType: 'json',
        cache: false,
        success: function(content) {
            var cnt = Object.keys(content).length;
            while(cnt > 0){
                cnt = cnt -1;
                if(content[cnt].aktiv == 1){
                    $('[data-highlight='+content[cnt].lottozahl+']').css('backgroundColor', "rgb(255, 255, 255)");
                }else{
                    $('[data-highlight='+content[cnt].lottozahl+']').css('backgroundColor', "rgb(192, 192, 192)");
                }
            }
        }
    });

    //Ajax für DB Eintrag
    $('#leeren').on('click', function() {
        $.ajax({
        type: "POST",
            url: "ajax_lottozahlen.php",
            data: {
                load: 2
            },
            success: function(content) {
                location.reload();
            }
        });
    });

    //Klick auf Zelle dieses ausführen
    $('.td_ent').on('click', function() {
        var bgcolor = $(this).css('backgroundColor');
        var lottozahl = $(this).data("highlight");
        var aktiv = 0;

        //Farbwechsel
        if(bgcolor === 'rgb(192, 192, 192)'){
            $(this).css('backgroundColor', "rgb(255, 255, 255)");
            aktiv = 1;
        }else{
            $(this).css('backgroundColor', "rgb(192, 192, 192)");
            aktiv = 0;
        }

        //Ajax für DB Eintrag
        $.ajax({
        type: "POST",
            url: "ajax_lottozahlen.php",
            data: {
                aktiv: aktiv,
                lottozahl: lottozahl
            },
            success: function(content) {
            }
        });
    });
});
lottozahlen.php:
HTML:
<html>
    <head>
        <title>Lottotzahlen</title>
        <script src="jquery.js"></script>
        <script src="lottotzahlen.js"></script>
<style>

td { text-align:center; }

</style>
    </head>
    <body>
    <br /><br />
        <table width="20%" border="1" align="center">
          <tr>
              <td colspan="7" style="color:black; text-align:right; font-size:12px;" height="30px">
                  Zahlen entfernen <span id="leeren" class="glyphicon glyphicon-trash" style="color:red;">Leeren</span></a>
              </td>
          </tr>
          <tr>
            <td class="td_ent" id="Zahl1" data-highlight="1">1</td>
            <td class="td_ent" id="Zahl2" data-highlight="2">2</td>
            <td class="td_ent" id="Zahl3" data-highlight="3">3</td>
            <td class="td_ent" id="Zahl4" data-highlight="4">4</td>
            <td class="td_ent" id="Zahl5" data-highlight="5">5</td>
            <td class="td_ent" id="Zahl6" data-highlight="6">6</td>
            <td class="td_ent" id="Zahl7" data-highlight="7">7</td>
          </tr>
          <tr>
            <td class="td_ent" id="Zahl8" data-highlight="8">8</td>
            <td class="td_ent" id="Zahl9" data-highlight="9">9</td>
            <td class="td_ent" id="Zahl10" data-highlight="10">10</td>
            <td class="td_ent" id="Zahl11" data-highlight="11">11</td>
            <td class="td_ent" id="Zahl12" data-highlight="12">12</td>
            <td class="td_ent" id="Zahl13" data-highlight="13">13</td>
            <td class="td_ent" id="Zahl14" data-highlight="14">14</td>
            </tr>
          <tr>
            <td class="td_ent" id="Zahl15" data-highlight="15">15</td>
            <td class="td_ent" id="Zahl16" data-highlight="16">16</td>
            <td class="td_ent" id="Zahl17" data-highlight="17">17</td>
            <td class="td_ent" id="Zahl18" data-highlight="18">18</td>
            <td class="td_ent" id="Zahl19" data-highlight="19">19</td>
            <td class="td_ent" id="Zahl20" data-highlight="20">20</td>
            <td class="td_ent" id="Zahl21" data-highlight="21">21</td>
            </tr>
          <tr>
            <td class="td_ent" id="Zahl22" data-highlight="22">22</td>
            <td class="td_ent" id="Zahl23" data-highlight="23">23</td>
            <td class="td_ent" id="Zahl24" data-highlight="24">24</td>
            <td class="td_ent" id="Zahl25" data-highlight="25">25</td>
            <td class="td_ent" id="Zahl26" data-highlight="26">26</td>
            <td class="td_ent" id="Zahl27" data-highlight="27">27</td>
            <td class="td_ent" id="Zahl28" data-highlight="28">28</td>
            </tr>
          <tr>
            <td class="td_ent" id="Zahl29" data-highlight="29">29</td>
            <td class="td_ent" id="Zahl30" data-highlight="30">30</td>
            <td class="td_ent" id="Zahl31" data-highlight="31">31</td>
            <td class="td_ent" id="Zahl32" data-highlight="32">32</td>
            <td class="td_ent" id="Zahl33" data-highlight="33">33</td>
            <td class="td_ent" id="Zahl34" data-highlight="34">34</td>
            <td class="td_ent" id="Zahl35" data-highlight="35">35</td>
            </tr>
          <tr>
            <td class="td_ent" id="Zahl36" data-highlight="36">36</td>
            <td class="td_ent" id="Zahl37" data-highlight="37">37</td>
            <td class="td_ent" id="Zahl38" data-highlight="38">38</td>
            <td class="td_ent" id="Zahl39" data-highlight="39">39</td>
            <td class="td_ent" id="Zahl40" data-highlight="40">40</td>
            <td class="td_ent" id="Zahl41" data-highlight="41">41</td>
            <td class="td_ent" id="Zahl42" data-highlight="42">42</td>
            </tr>
          <tr>
            <td class="td_ent" id="Zahl43" data-highlight="43">43</td>
            <td class="td_ent" id="Zahl44" data-highlight="44">44</td>
            <td class="td_ent" id="Zahl45" data-highlight="45">45</td>
            <td class="td_ent" id="Zahl46" data-highlight="46">46</td>
            <td class="td_ent" id="Zahl47" data-highlight="47">47</td>
            <td class="td_ent" id="Zahl48" data-highlight="48">48</td>
            <td class="td_ent" id="Zahl49" data-highlight="49">49</td>
</tr>
        </table>
</body>
Ich habe nur die Zahlen 1-7 in der Datenbank, damit kann man testen.
Ich habe nun auch andere Dateinamen vergeben, das man es besser auseinander halten kann.
 
Zurück