Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. Steuerelement in HTML-Tabelle

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    Steuerelement in HTML-Tabelle

    This topic has been deleted. Only users with topic management privileges can see it.
    • ?
      A Former User @GiuseppeS last edited by A Former User

      @GiuseppeS

      Nächster Versuch. Erstmal mit einem fixen Text und dann das mit dem dynamischen 🙂

      Hier die angepasste:

      <table border="1">
        <tr>
          <td class="HeaderFormat" align="center">Gerät</td>      
          <td class="HeaderFormat" align="center"><b>Heute</b></td>
          <td class="HeaderFormat" align="center"><b>Gestern</b></td>    
          <td class="HeaderFormat" align="center"><b>Gesamt</b></td>
          <td>
      	<button style="border:none; background-color:transparent; color:white; font-size:1em; text-align:left" value="Geraet" ondblclick="setOnDblClickCustom(this.value)">Gerät</button>
      	</td>
        </tr>  
        <tr>
          <td class="LineFormat" align="center"><b>SolarHaus</b></td>
          <td class="LineFormat" align="center"><b>{hs100.0.192_168_2_112.totalNow}kWh</b></td>
          <td class="LineFormat" align="center"><b>{0_userdata.0.daily_earning_solar_house}kWh</b></td>
          <td class="LineFormat" align="center"><b>{0_userdata.0.total_earning_solar_house}kWh</b></td>
          <td>
      	<button style="border:none; background-color:transparent; color:white; font-size:1em; text-align:left" value="SolarHaus" ondblclick="setOnDblClickCustom(this.value)">SolarHaus</button>
      	</td> 
        </tr>
      </table>
       
      <script>
      function setOnDblClickCustom(val) {
      var objID = "0_userdata.0.TestDP";
      this.servConn._socket.emit('setState', objID, val);
      }
      </script>
      

      Wenn ich nun draufklicke, müsste doch der Wert in den DP geschrieben werden oder nicht? Aktuell ist da noch NULL (nicht 0)

      EDIT: Ich habe es gefunden. Das ist ein Funktion für Doppelklick "OnDblClickCustom"; Da habe ich nicht genau die Funktion mir angesehen 🙂

      G 1 Reply Last reply Reply Quote 0
      • G
        GiuseppeS @Guest last edited by

        @HeinrichB
        Es klappt auch mit einem einfachen Klick wenn "onClick" bei den Buttons verwendet wird. Im html Code aus meiner Tabelle sind beide Funktionen drin. Einfach reinschauen. Wollte es hier unkomplizierter halten 😉

        ? liv-in-sky 2 Replies Last reply Reply Quote 0
        • ?
          A Former User @GiuseppeS last edited by

          @GiuseppeS Hallo, das war meine Schusseligkeit. Ich kenn grundsätzlich beide Varianten, nur habe ich da nicht sauber hingeschauen

          Und jetz baue ich meinen Trigger auf den DP und setze dann die anderen DP zum Anzeigen des Butto-Texts per Binding 🙂

          1 Reply Last reply Reply Quote 0
          • liv-in-sky
            liv-in-sky @GiuseppeS last edited by

            @GiuseppeS kann man da eine toggle function einbauen ?

            ich bekomm diesen getStates befehl nicht hin - hast du da ahnung ?

            <script>
            function setOnDblClickCustom(val) {
            var objID = "0_userdata.0.buttonTestBox";
            var getty =this.servConn._socket.emit('getStates', objID);
            if (getty.val) {this.servConn._socket.emit('setState', objID, false);} else {this.servConn._socket.emit('setState', objID, true);}
            
            }
            </script>
            

            ist das machbar - getStates soll ja ein object zurückgeben

            G 1 Reply Last reply Reply Quote 0
            • G
              GiuseppeS @liv-in-sky last edited by GiuseppeS

              @liv-in-sky
              Mit getStates hatte ich noch nicht gearbeitet.
              Funktioniert sicher die Abfrage nicht? Oder scheitert es bei der If-Bedingung? Wenn ein Objekt zurück kommt, dann könnte getty.state.val statt getty.val funktionieren.

              liv-in-sky 1 Reply Last reply Reply Quote 0
              • liv-in-sky
                liv-in-sky @GiuseppeS last edited by

                @GiuseppeS habe einen eigenen thread aufgemacht - da einzige was ich gefunden haben zu getStates habe ich im thread https://forum.iobroker.net/topic/29851/socket-io-state-lesen-und-setzen

                probiert

                1 Reply Last reply Reply Quote 0
                • G
                  GiuseppeS last edited by

                  Im anderen Thread ist man ein gutes Stück weiter gekommen. Anscheinend funktioniert auch die Funktion aus VIS heraus auch mit dieser Schreibweise:

                  function setOnClickDevices(val) {
                      var objID = "javascript.0.Timer.Devices.clickTarget";
                      servConn.setState(objID, val);
                  }
                  

                  Zuvor hatte ich hier meine Lösung gezeigt, wo ich die Hauptfunktionen nach diesem Schema gezeigt habe:

                  this.servConn._socket.emit('setState', objID, val);
                  

                  Keine Ahnung ob es Nebenwirkungen gibt, aber auf diese Weise ist der Code kürzer und (viel wichtiger) die offizielle socket.io Doku auf Github macht mit den Aufrufen endlich Sinn.

                  @HeinrichB
                  Im verlinkten Thread von @liv-in-sky wird das Togglen geklärt. Wenn Du in deiner Tabelle rein statisch ausschließlich togglen möchtest, wäre das was für dich. Dann wird kein Trigger-Skript benötigt, wie ich es bei mir mache.

                  ? 1 Reply Last reply Reply Quote 0
                  • ?
                    A Former User @GiuseppeS last edited by

                    @GiuseppeS said in Steuerelement in HTML-Tabelle:

                    Im verlinkten Thread von @liv-in-sky wird das Togglen geklärt. Wenn Du in deiner Tabelle rein statisch ausschließlich togglen möchtest, wäre das was für dich. Dann wird kein Trigger-Skript benötigt, wie ich es bei mir mache.

                    Danke für den Hinweis. Das schaue ich mir auf jeden Fall mal an 🙂

                    Glasfaser 1 Reply Last reply Reply Quote 0
                    • Glasfaser
                      Glasfaser @Guest last edited by Glasfaser

                      @HeinrichB

                      Könntest du vielleicht dein ganzes Skript zur Verfügung stellen , da es ja jetzt bei dir funktioniert !?
                      Bin ja auch gerne am Basteln 😉

                      liv-in-sky ? 2 Replies Last reply Reply Quote 0
                      • liv-in-sky
                        liv-in-sky @Glasfaser last edited by liv-in-sky

                        @Glasfaser ist das nicht hier - ist ein wenig hin und her zwischen den threads

                        https://forum.iobroker.net/post/373006

                        1 Reply Last reply Reply Quote 0
                        • ?
                          A Former User @Glasfaser last edited by

                          @Glasfaser

                          Hier meine Tabelle, wofür ich die Buttons verwende. Ich hab nur ein paar Tabellenzeilen der Übersichtlichkeit wegen rausgelöscht.

                          <table border="1">
                           <tr>
                             <td class="FirstColoumnFormat" align="center">Waschmaschine</td>   
                             <td class="LineFormat" align="center"><b>{sonoff.0.WaschMaschine.INFO.IPAddress}</b></td>
                             <td class="LineFormat" align="center"><b>{sonoff.0.WaschMaschine.Wifi_RSSI}%</b></td>
                             <td class="LineFormat" align="center"><b>{sonoff.0.WaschMaschine.INFO.Hostname}</b></td>
                             <td class="LineFormat" align="center"><b>{sonoff.0.WaschMaschine.Time;date(DD.MM.YY hh:mm)}</b></td>
                             <td>
                                 <button value="Waschmaschine" onClick="setOnClickCustom(value)">{v:sonoff.0.WaschMaschine.POWER;v == "true" ? "An":"Aus"}</button>
                             </td> 
                           </tr> 
                           <tr>
                             <td class="FirstColoumnFormat" align="center">ZBox</td>   
                             <td class="LineFormat" align="center"><b>{sonoff.0.ZBox.INFO.IPAddress}</b></td>
                             <td class="LineFormat" align="center"><b>{sonoff.0.ZBox.Wifi_RSSI}%</b></td>
                             <td class="LineFormat" align="center"><b>{sonoff.0.ZBox.INFO.Hostname}</b></td>
                             <td class="LineFormat" align="center"><b>{sonoff.0.ZBox.Time;date(DD.MM.YY hh:mm)}</b></td>
                             <td>
                                 <button value="ZBox" onClick="setOnClickCustom(value)">{v:sonoff.0.ZBox.POWER;v == "true" ? "An":"Aus"}</button>
                             </td> 
                           </tr> 
                           <tr>
                             <td class="FirstColoumnFormat" align="center">Wasserkocher</td>   
                             <td class="LineFormat" align="center"><b>{sonoff.0.Wasserkocher.INFO.IPAddress}</b></td>
                             <td class="LineFormat" align="center"><b>{sonoff.0.Wasserkocher.Wifi_RSSI}%</b></td>
                             <td class="LineFormat" align="center"><b>{sonoff.0.Wasserkocher.INFO.Hostname}</b></td>
                             <td class="LineFormat" align="center"><b>{sonoff.0.Wasserkocher.Time;date(DD.MM.YY hh:mm)}</b></td>
                             <td>
                                 <button value="Wasserkocher" onClick="setOnClickCustom(value)">{v:sonoff.0.Wasserkocher.POWER;v == "true" ? "An":"Aus"}</button>
                             </td> 
                           </tr>    
                          </table>
                          
                          <script>
                          function setOnClickCustom(val) {
                             var objID;
                             if (val == "Waschmaschine") {
                                 objID = "sonoff.0.WaschMaschine.POWER";
                             }
                             if (val == "Wasserkocher") {
                                 objID = "sonoff.0.Wasserkocher.POWER";
                             }
                             if (val == "ZBox") {
                                 objID = "sonoff.0.ZBox.POWER";
                             } 
                             servConn.getStates(objID, (error, states) => {
                                 console.log(states);
                                 servConn.setState(objID, !states[objID].val);
                             });
                          }
                          </script>
                          

                          liv-in-sky Glasfaser 3 Replies Last reply Reply Quote 1
                          • liv-in-sky
                            liv-in-sky @Guest last edited by

                            @HeinrichB

                            wie sieht den der button in der tabelle aus - magst du ein bild zeigen - ich würde ein z.b. für toggle 🔄 genutzt oder 🔀

                            ? 1 Reply Last reply Reply Quote 0
                            • ?
                              A Former User @liv-in-sky last edited by A Former User

                              @liv-in-sky Der ist aktuell sehr primitiv noch

                              Bildschirmfoto 2020-02-07 um 13.39.43.JPG

                              Funktioniert aber; jedoch muss man der Tabelle etwas Zeit beim ersten Mal lassen /2-3sec., da die Bindings etwas brauchen

                              liv-in-sky 1 Reply Last reply Reply Quote 0
                              • liv-in-sky
                                liv-in-sky @Guest last edited by liv-in-sky

                                @HeinrichB ah - der button wird bei mir nicht angezeigt - da habe ich wohl wieder einen kleinen "unsichtbaren" fehler

                                ? 1 Reply Last reply Reply Quote 0
                                • liv-in-sky
                                  liv-in-sky @Guest last edited by

                                  @HeinrichB

                                  wenn mal die muse stimmt, werde ich mal versuchen, dass in mein sonoff script zu integrieren

                                  1 Reply Last reply Reply Quote 0
                                  • ?
                                    A Former User @liv-in-sky last edited by

                                    @liv-in-sky Was ein Performance-Problem werden könnte, zumindestens bei mir, sind die Bindings. ich habe meine Tabelle bspw. auf zwei aufbrechen müssen, damit alle geladen wurden. Aber das ist ja ein bekanntes Problem. Das schläft sich auch auf die Buttons durch, dass sie bei vielen Zeilen dann wohl nicht immer direkt reagieren. Aber das muss ich noch genauer beobachten. Manchmal läuft auch der Chrome bei mir voll, und ich muss einmal alles neu öffnen und dann rennt es wieder 🙂

                                    liv-in-sky 1 Reply Last reply Reply Quote 0
                                    • liv-in-sky
                                      liv-in-sky @Guest last edited by liv-in-sky

                                      @HeinrichB du hast auch ein anderes vorgehen wie bei meinen scripts - bei mir werden diese tabellen immer wieder erzeugt - z.b minütlich - in der tabelle selbst steht bei mir kein binding sondern nur statisch werte. wenn ich den toggle knopf drücke, muss das script in der html-tabelle das hauptscript (die ja völlig getrennt sind) erst triggern, damit ich den wert sehe (oder eine minute warten bis der wert wieder ausgelesen und in der tabelle verarbeitet ist) - dazu benötige ich einen extra datenpunkt, den das haupt-tabellenscript überprüft, bzw der es triggert. dann wären die werte sofort sichtbar

                                      bei deinem script, zeigt das binding die werte

                                      du hast sozusagen eine statische tabelle mit dynam. binding
                                      ich nutze eine dynamische tabelle mit stat. werten, die immer einen trigger brauchen um aktuell zu sein

                                      ? 1 Reply Last reply Reply Quote 0
                                      • ?
                                        A Former User @liv-in-sky last edited by

                                        @liv-in-sky

                                        Danke, ich hab einfach mit meinem Wissen das beste rausgeholt. Das geht bestimmt wesentlich eleganter und generischer.

                                        1 Reply Last reply Reply Quote 0
                                        • Glasfaser
                                          Glasfaser @Guest last edited by

                                          @HeinrichB sagte in Steuerelement in HTML-Tabelle:

                                          @Glasfaser

                                          Hier meine Tabelle,...….

                                          sehr schöne Vorlage und funktioniert gut .

                                          Danke 👍

                                          ? 1 Reply Last reply Reply Quote 0
                                          • ?
                                            A Former User @Glasfaser last edited by

                                            @Glasfaser Freut mich 🙂

                                            1 Reply Last reply Reply Quote 0
                                            • First post
                                              Last post

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            388
                                            Online

                                            31.8k
                                            Users

                                            80.0k
                                            Topics

                                            1.3m
                                            Posts

                                            vis
                                            5
                                            45
                                            2446
                                            Loading More Posts
                                            • Oldest to Newest
                                            • Newest to Oldest
                                            • Most Votes
                                            Reply
                                            • Reply as topic
                                            Log in to reply
                                            Community
                                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                            The ioBroker Community 2014-2023
                                            logo