NEWS
Probleme in VIS beim Setzen von States mit HTML / JavaScript
-
Hallo zusammen,
ich habe eine Frage zum HTML Widget im Zusammenspiel mit CSS und JavaScript, welches ich zur eigenen Gestaltung der Bedienoberfläche im VIS nutzen möchte. Ich nutze die CSS und JS Komponenten einer externen UI, der Semantic UI. Ich habe mich bisher an einer Checkbox bzw. an einem Toggle versucht. Leider wird aus dem HTML bzw. JavaScript kein Ereignis ausgelöst.
Vielleicht kann mir hier ein Experte für VIS im Zusammenspiel mit HTML / JavaScript helfen.
Visualisierung:
HTML Widget:
HTML Quellcode:
<!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="/vis.0/Home/Semantic/semantic.min.css"> <script src="/vis.0/Home/Semantic/semantic.min.js"></script> </head> <body> <div class="ui toggle checkbox" style="padding-left: 5px; padding-top: 5px;"> <input type="checkbox" id="ExtLight_House_Front"/> <label class="text-normal">Außenbeleuchtung Haus Vorne</label> </div> <script type="text/javascript"> // Check if document is ready $(document).ready(function() { // Click Event on Widget $("#w00017").on("click", function() { // Checkbox $("#ExtLight_House_Front").checkbox({ onChecked() { setValue("0_userdata.0.ExtLight_House_Front", "true"); }, onUnchecked() { setValue("0_userdata.0.ExtLight_House_Front", "false"); }, }); }); }); </script> </body> </html>
Die Funktion setValue in den Vis Skripten wird aus dem HTML Code aufgerufen:
Diese Funktion ruft setState auf und setzt den Wert "false" oder "true" für das Objekt "ExtLight_House_Front":
In den allgemeinen Skripten läuft ein Skript zur Überwachung des Objektes, welches bei Änderung den Wert einer HomeMatic Komponente ändern soll:
Leider scheitert es aber schon am HTML Widget selbst bzw. wird bei Änderung kein Ereignis ausgelöst. Das JavaScript scheint nicht zu greifen.
Vor dem Aufbau mit SemanticUI hatte ich es auch einmal mit dem HTML Widget und einem normalen Checkbox Input versucht. Dabei hatte ich die Checkbox ID via getElementByID abgegriffen und in den VIS Skripten via Event Handler auf ein Ereignis gewartet. Leider funktionierte auch diese Lösung nicht. Als ob keins der Skripte greift.
Habe ich irgendwo einen Denkfehler? Muss ich grundlegend etwas ändern? Über Anregungen bzw. Lösungsvorschläge würde ich mich freuen.
Vielen Dank im voraus & Grüße
Tra1n