myGully.com Boerse.SH - BOERSE.AM - BOERSE.IO - BOERSE.IM
Ungelesen 14.09.14, 13:01   #1
yllug
Newbie
 
Registriert seit: Oct 2008
Beiträge: 70
Bedankt: 38
yllug ist noch neu hier! | 0 Respekt Punkte
Standard Lokale Webseite mit SQL erstellen

Hallo,

ich nutze zu Hause Funksteckdosen die ich mitells eines Microcontrollers auch über ein Webinterface steuern kann.
Nun möchte ich mir eine eigene Webseite erstellen mit dem Grundriss meiner Wohnung und den dem Standort der Funksteckdosen. Ich möchte mit einem Klick auf ein Lampen Icon die Lampe einschalten, worauf sich auch das Icon in eine eingaschaltete Lampe verändert und umgekehrt. Den Zustand der Lampen/Funksteckdosen möchte ich in einer Mysql Datenbank abspeichern.

Nun weiß ich nicht, wie ich eine Abfrage der Datenbank mit dem anzeigen des richtigen Icons herstellen kann. Habe schon mit PHP, AJAX und JAvascript rumgespielt, leider steh ich grad ziemlich auf dem Schlauch und komme nicht weiter. Unten seht Ihr meinen aktuellen Code, ohne Datenbankabfrage. Ich hofe ihr könnt mir weiterhelfen!

PHP-Code:
<html>
<head>

<style type="text/css">
body {background-color: #818181;} 

#LampTv {
    position: absolute;
    left: 900px;
    top: 1000px;
    z-index: 1;
}
#LampSofa {
    position: absolute;
    left: 1280px;
    top: 1000px;
    z-index: 1;
}
#XBMC {
    position: absolute;
    left: 900px;
    top: 850px;
    z-index: 1;
}
</style>



<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Home-Page</title>
</head>
<body>
<?php
    
//Verbindung zur Datenbank herstellen
    
mysql_connect("localhost""root","") or die ("Verbindung nicht möglich");
    
mysql_select_db("homecontrol") or die ("Datenbank existiert nicht");
 
    
//Lampe Couch auswählen
    
$Funk1 mysql_query(SELECT zustand FROM 'funksteckdosen' WHERE standort='Lampe Couch');
    
//Funktion für DB Abfrage ob Lampe an oder aus.
    
boolean $Lampengrafik False;
    if 
Funk1 "Aus" {
    
$Lampengrafik False;
    }else{
    
$Lampengrafik True;}
    
?>

<script>

//Funktion für Lampen
function Lampe(Url) {
    var xmlhttp;
    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();
    }
    else 
    {
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function () 
    {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
        {
        //document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
        }
        }
        xmlhttp.open("GET", Url , true);
        xmlhttp.send();
    }    
    
//Grafikewechsel bei klick Funktion
var SwitchImg = new Array();

// hier werden die URLs der Grafiken eingetragen

SwitchImg[1] = "ligthbulb_off.png";
SwitchImg[2] = "ligthbulb_on.png";
SwitchImg[3] = "raspi_off.png";
SwitchImg[4] = "raspi_on.png";


LampFlag = 'on'

    function Tauschen(DeviceId, x, y)
    {
      if (LampFlag == 'on'){
      document.getElementById(DeviceId).src = SwitchImg[x];
      LampFlag='off'
      }
      else
      {
      document.getElementById(DeviceId).src = SwitchImg[y];
      LampFlag='on'
      }
    }



        
</script>

<!Hintergrundbild = Wohnung>
<img src="bg_image.svg" id="background">
<!Link zur TV Lampe Wohnzimmer >
<img id="LampTv" onclick="Tauschen('LampTv', '1', '2'), Lampe('http://192.168.1.66/index.html?schalte&3')" src="ligthbulb_off.png">
<!Link zur Sofa Lampe Wohnzimmer>
<img id="LampSofa" onclick="Tauschen('LampSofa', '1', '2'), Lampe('http://192.168.1.66/index.html?schalte&1')" src="ligthbulb_off.png">
<!Link zum XBMC Raspberry Pi>
<img id="XBMC" onclick="Tauschen('XBMC', '3', '4'), Lampe('http://192.168.1.66/index.html?schalte&2')" src="raspi_off.png">
</body>
</html>
yllug ist offline   Mit Zitat antworten
Ungelesen 15.09.14, 07:39   #2
weberleins
Ist öfter hier
 
Registriert seit: May 2011
Beiträge: 240
Bedankt: 92
weberleins ist noch neu hier! | 6 Respekt Punkte
Standard

Manchmal macht es wirklich Sinn zu Googeln. [ Link nur für registrierte Mitglieder sichtbar. Bitte einloggen oder neu registrieren ]
weberleins ist offline   Mit Zitat antworten
Ungelesen 15.09.14, 17:57   #3
yllug
Newbie
 
Registriert seit: Oct 2008
Beiträge: 70
Bedankt: 38
yllug ist noch neu hier! | 0 Respekt Punkte
Standard

Manchmal mach es wirklich Sinn nicht zu antworten und sich als Klugscheisser aufzuspielen wenn man die Frage erst gar nicht verstanden hat.
yllug ist offline   Mit Zitat antworten
Folgendes Mitglied bedankte sich bei yllug:
Ungelesen 15.09.14, 18:51   #4
Delta538
Newbie
 
Registriert seit: Oct 2010
Beiträge: 98
Bedankt: 80
Delta538 ist noch neu hier! | 0 Respekt Punkte
Standard

Ich habe zwar schon Jahrelang nichts mehr in dem Bereich gemacht aber sollte ich dich richtig verstanden haben kannst du das ohne weiteres mit PHP lösen.

Pseudocode:
Code:
werte = datenbank.ladeDaten("SELECT...") //du gibtst dir einen oder alle Werte zurück

while(werte.hasNext)  || alle Ergebnisse aus der Datenbank durchlaufen bis es keine mehr gibt //ich weiß nicht genau wie das in PHP gemacht wird
{
    val = werte.getValue() || einen Wert betrachten 
    if(val == true)
    {
        HTML-CODE ZUM LAMPE ANSCHALTEN
    }
    else
    {
       HTML-CODE ZUM AUSSCHALTEN  
     }
   

}
Das ganze ist jetzt vielleicht ein wenig unschön aber ich hab die PHP-Syntax nicht mehr drauf. Wenn ich dich aber richtig verstanden habe, sollte das Beispiel oben für dein Problem funktionieren. Du musst dir nur nocheinmal anschauen wie SQL-Abfragen in PHP realisiert werden, da du eventuell das Beispiel nicht 1zu1 übernehmen, da ich nicht weiß wie die Datenstrukturen aussehen die du in PHP mit einem SQL-Statement zurückbekommst.

Eine ganz simple Datenbankstruktur wäre z.B. folgende:
Code:
CREATE TABLE lamps
(lampID Integer primary key,
 isOn Integer  check(isOn between 0 and 1),
 name text not null);
Da kannst du nun alle:
1.
Code:
SELECT lampID, isOn FROM lamps;
zurückgeben lassen oder auch nur eine:
2.
Code:
SELECT isOn FROM lamps WHERE id=4
Bei dem ersten kannst du dann durch iterieren jeweils den Zustandabfragen und dementsprechend auch die Lampen (wie in dem kleinen Beispiel) setzten. Beim zweiten kannst du dass dann individuell anpassen undzwar für jede Lampe einzelnt.
Delta538 ist offline   Mit Zitat antworten
Ungelesen 15.09.14, 23:40   #5
weberleins
Ist öfter hier
 
Registriert seit: May 2011
Beiträge: 240
Bedankt: 92
weberleins ist noch neu hier! | 6 Respekt Punkte
Standard

@yllug:
1. Wenn Du eine Antwort willst -> Dann stelle eine Frage und poste nicht einfach nur nen langen Code.
1.2. Hast du ein Problem mit einer Code-Stelle, dann poste diese - besser aber: Stelle Deine "Verständnis"-Frage. Den darum geht es hauptsächlich: wenn jemand etwas nicht versteht, es ihm/ihr so zu erklären, das die Person damit dann was anfangen kann. Und dann hat der jeweilige Thread zusätzlich auch noch Sinn für andere.
2. Wenn Du ein Problem einfach nur gelöst haben willst (ohne zu verstehen, warum es dann gelöst ist) -> es gibt unzählige Anleitungen UND fertige Codes (was Du willst ist nicht erkenntlich, da keine Frage) im Netz und die findet man z.B. dank Google und kann sie dann einfach verwenden. Idiotensicher.
3. Delta538 war so frei hat und Dir eine technische Möglichkeit (die bei mir Google-Ergebnis 4 ist) gepostet. SOLLTE das Deine Frage gewesen sein, dann dürfte sie ja jetzt beantwortet sein und Du kannst Dich freuen.
weberleins ist offline   Mit Zitat antworten
Ungelesen 20.06.18, 11:12   #6
Wodddy
Anfänger
 
Registriert seit: Dec 2014
Beiträge: 8
Bedankt: 0
Wodddy ist noch neu hier! | 3 Respekt Punkte
Standard

Zitat:
Zitat von weberleins Beitrag anzeigen
@yllug:
1. Wenn Du eine Antwort willst -> Dann stelle eine Frage und poste nicht einfach nur nen langen Code.
1.2. Hast du ein Problem mit einer Code-Stelle, dann poste diese - besser aber: Stelle Deine "Verständnis"-Frage. Den darum geht es hauptsächlich: wenn jemand etwas nicht versteht, es ihm/ihr so zu erklären, das die Person damit dann was anfangen kann. Und dann hat der jeweilige Thread zusätzlich auch noch Sinn für andere.
2. Wenn Du ein Problem einfach nur gelöst haben willst (ohne zu verstehen, warum es dann gelöst ist) -> es gibt unzählige Anleitungen UND fertige Codes (was Du willst ist nicht erkenntlich, da keine Frage) im Netz und die findet man z.B. dank Google und kann sie dann einfach verwenden. Idiotensicher.
3. Delta538 war so frei hat und Dir eine technische Möglichkeit (die bei mir Google-Ergebnis 4 ist) gepostet. SOLLTE das Deine Frage gewesen sein, dann dürfte sie ja jetzt beantwortet sein und Du kannst Dich freuen.
Was eine Mumu!
Wodddy ist offline   Mit Zitat antworten
Ungelesen 25.08.18, 17:38   #7
ChuckVinyard
Anfänger
 
Registriert seit: Jul 2014
Beiträge: 1
Bedankt: 0
ChuckVinyard ist noch neu hier! | 3 Respekt Punkte
Standard

Hallo,

ohne, dass ich jetzt selbst etwas geschrieben haben....

Zur Funktion der Lampe kann ich leider wenig sagen. Ich gehe mal davon aus, dass du die Funktion aus irgendeiner Doku hast und die Funktioniert.

Ich gebe mal zu viele Informationen (Besser als zu wenige :-D und vielleicht liest es auch noch jemand anders):
Zum allgemeinen Verständnis: JavaScript wird auf deinem PC (in deinem Browser) ausgeführt. PHP hingegen auf eine Server. Bei einem lokalen Server wahrscheinlich auch dein PC, aber eben ein Server. MySQL läuft ebenfalls auf einem Server. Du kannst daher von PHP nach MySQL. Aus JavaScript kommst du allerdings nicht auf MySQL, da du dich auf einer Anderen Ebene bewegst. Wenn du AJAX benutzt setzt du mit JavaScript aus deinem Browser einen neuen Aufruf/Abfrage gegen deinen Server ab.
Du kannst also mit AJAX von JavaScript wieder PHP und damit dann auch MySQL benutzen.
Das Ergebnis davon (das Ergebnis des PHP-Scripts welches du Aufrufst) kannst du verarbeiten und benutzen.

In deinem Fallbeispiel:
1. Du lädst deine Seite --> Abfrage PHP welches Icon passt.
2. PHP wird verarbeitet und erstellt eine Seite die vom Server an deinen Browser zurückgegeben wird.
2.1. Das bedeutet, dass du keine Variablen von PHP mehr im JavaScript zur Verfügung hast. Gib mit "Echo" zurück, was auf der Seite stehen soll. Heißt für dich: In PHP kannst du schreiben "Echo '<div id="ergebnis">'.$VARIABLE_MIT_ERGEBNIS.'</div>' ([ Link nur für registrierte Mitglieder sichtbar. Bitte einloggen oder neu registrieren ])
3. Seite wird in deinem Browser gerendert
4. Du kannst mir JavaScript abfragen, was in dem in PHP zurückgegebenen Div steht und benutzen um das Richtige Icon anzuzeigen.
5. Du Klickst auf das Icon
6. Der klick löst einen AJAX Aufruf aus (Vielleicht mal jQuery oder so benutzen. Dann wird AJAX deutlich leichter) [ Link nur für registrierte Mitglieder sichtbar. Bitte einloggen oder neu registrieren ]
7. Das Skript das aufgerufen wird sollte auf deinem Server sein und aus PHP bestehen und dann die Datenbank verändern

Ist jetzt sehr quick and dirty und auch keine so richtig schöne lösung, aber wenn du mit den technologien ein bisschen herumspielst und der ablauf erstmal deutlich wird, dann wird auch der rest schöner :-)

Ich hoffe ich konnte einigermaßen helfen. Verlass dich nicht darauf, dass ich in einem Texteditor am Samstag abend keinen fehler gemacht habe :-)
Sollte ich zu viele Informationen gegeben oder Rechtschreibfehler gemacht haben ignorier sie einfach.

Viele Grüße
ChuckVinyard ist offline   Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Du kannst keine neue Themen eröffnen
Du kannst keine Antworten verfassen
Du kannst keine Anhänge posten
Du kannst nicht deine Beiträge editieren

BB-Code ist An.
Smileys sind An.
[IMG] Code ist An.
HTML-Code ist Aus.

Gehe zu


Alle Zeitangaben in WEZ +1. Es ist jetzt 05:07 Uhr.


Sitemap

().