Skip to content
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Skripten / Logik
  4. JavaScript
  5. suche javascript und vis expertenwissen

NEWS

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    8.8k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    2.2k

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    16
    1
    3.2k

suche javascript und vis expertenwissen

Geplant Angeheftet Gesperrt Verschoben JavaScript
15 Beiträge 3 Kommentatoren 1.6k Aufrufe 3 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • liv-in-skyL liv-in-sky

    ich hätte da ein frage - ich kann über ein js-script eine checkbox in einem html-widget erzeugen - also keine checkbox als widget sondern über html erzeugt !

               if (val1==false) {val1="<input type='checkbox' id='"+val0+val1+val2+val3+"' .....
    

    weiß jemand , wie ich darauf reagieren kann - geht das über den script-tab in der vis ? geht das überhaupt

    @senger1985

    OliverIOO Offline
    OliverIOO Offline
    OliverIO
    schrieb am zuletzt editiert von
    #4

    @liv-in-sky
    Schau mal hier. Da ist das Prinzip sichtbar.
    https://stackoverflow.com/questions/2055459/dynamically-create-checkbox-with-jquery-from-text-input

    Meine Adapter und Widgets
    TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
    Links im Profil

    liv-in-skyL 1 Antwort Letzte Antwort
    0
    • liv-in-skyL Offline
      liv-in-skyL Offline
      liv-in-sky
      schrieb am zuletzt editiert von
      #5

      @senger1985

      nimm mal das script - ist neu mit deiner zeile drin

      
      
      //HIER WIRD PFAD UND FILENAME DEFINIERT
      const path = "/htmlexample.html";                   //FIlenamen definieren
      const home ='vis.0'                                 //wo soll das file im iobroker-file-system liegen ? (oder z.b auch iqontrol.meta)
      let   braucheEinFile=false;                          // bei true wird ein file geschrieben - für iqontrol
      let   braucheEinVISWidget=true;                     // bei true wird ein html-tabelle in einen dp geschrieben - siehe nächste zeile
      let dpVIS="controll-own.0.AAATEST.TestHTML"         //WICHTIG wenn "braucheEinVISWidget" auf true gesetzt !!  dp zusätzlich für VIS-HTML-Basic-Widget // Datentyp: String
      let dPDELETE="controll-own.0.AAATEST.TestHTMLAuswahlDelete";                // Datentyp: Werteliste
      let dPDELETEWert="controll-own.0.AAATEST.TestHTMLAuswahlDeleteWert";        // Datentyp: String
      let dPDELETEAuswahl="controll-own.0.AAATEST.TestHTMLAuswahlDeleteAuswahl";  // Datentyp: String
      let dpANLEGEN="controll-own.0.AAATEST.Neues_ObjektTestHTMLAnlegen";         // Datentyp: String
      let mySchedule=" * * * * * ";                       //jede minute
      //---------------------------------------
      
      //HIER DIE SPALTEN ANZAHL DEFINIEREN - jede Spalte einen Wert - in diesem Beispiel sind es 4
      var htmlFeld1='Einkaufen';                            // überschrift Tabellen Spalte1
      var htmlFeld2='Finished';                              // überschrift Tabellen Spalte2
      var htmlFeld3='Created';                             // überschrift Tabellen Spalte3
      var htmlFeld4='Since...';                            // überschrift Tabellen Spalte4
      //-----------------------------------
      
      
      //hier werden die styles für die tabelle definiert
      //ÜBERSCHRIFT ÜBER TABELLE
      let   htmlUberschrift=true;                           // mit Überschrift über der tabelle
      const htmlFeldUeber="ALEXA ToDo's";              // Überschrift
      const htmlFarbUber="white";                         // Farbe der Überschrift
      //MEHRERE TABELLEN NEBENEINANDER
      let   mehrfachTabelle=1;                              // bis zu 4 Tabellen werden nebeneinander geschrieben-  verkürzt das Ganze, dafür etwas breiter - MÖGLICH 1,2,3,oder 4 !!!
      const htmlFarbZweiteTabelle="black";                // Farbe der Überschrift bei jeder 2.ten Tabelle
      const htmlFarbTableColorUber="black";               // Überschrift in der tabelle - der einzelnen Spalten
      //GANZE TABELLE
      const backgroundAll="#000000";
      const htmlSchriftart="Helvetica";
      const htmlSchriftgroesse="13px";
      //FELDER UND RAHMEN
      const htmlFarbFelderschrift="white";                  // SchriftFarbe der Felder
      const htmlFarbFelderschrift2="white";                 // SchriftFarbe der Felder für jede 2te Tabelle
      const htmlFarbTableColorGradient1="#66b8ea";          //  Gradient - Hintergrund der Tabelle - Verlauffarbe
      const htmlFarbTableColorGradient2="#5f85cf";          //  Gradient - Hintergrund der Tabelle - ist dieser Wert gleich Gradient1 gibt es keinen verlauf
      const htmlFarbTableBorderColor="#2C7FB6";             // Farbe des Rahmen - is tdieser gleich den gradienten, sind die rahmen unsichtbar
      const htmlRahmenLinien=1;                          // Format für Rahmen(Gitter)linien 1=alle - 2=nur vertikal - 3= nur horizontal - 4=keine
      
      
      // HIER NICHTS  ÄNDERN
      const htmlEnd=      '</table></body>';
      const htmlStart=    "<!DOCTYPE html><html lang=\"de\"><head><title>Vorlage</title><meta http-equiv=\"content-type\" content=\"text/html; charset=utf-8\"></head><body bgcolor=\""+backgroundAll+"\">";
      //const htmlUeber=    "<p style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-weight: bold\">"+htmlFeldUeber+"</p>";
      const htmlTabStyleCol= "<table bordercolor=\""+htmlFarbTableBorderColor+"\" border=\"3\" cellspacing=\"3\" cellpadding=\"3\"  rules=\"cols\" style=\"color:"+htmlFarbFelderschrift+";  font-size:"+htmlSchriftgroesse+
                            "; font-family:"+htmlSchriftart+";background-image: linear-gradient(42deg,"+htmlFarbTableColorGradient2+","+htmlFarbTableColorGradient1+");\">";
      const htmlTabStyleRow= "<table bordercolor=\""+htmlFarbTableBorderColor+"\" border=\"3\" cellspacing=\"3\" cellpadding=\"3\"  rules=\"rows\" style=\"color:"+htmlFarbFelderschrift+";  font-size:"+htmlSchriftgroesse+
                            "; font-family:"+htmlSchriftart+";background-image: linear-gradient(42deg,"+htmlFarbTableColorGradient2+","+htmlFarbTableColorGradient1+");\">";
      const htmlTabStyleAll= "<table bordercolor=\""+htmlFarbTableBorderColor+"\" border=\"3\" cellspacing=\"3\" cellpadding=\"3\"  rules=\"all\" style=\"color:"+htmlFarbFelderschrift+";  font-size:"+htmlSchriftgroesse+
                            "; font-family:"+htmlSchriftart+";background-image: linear-gradient(42deg,"+htmlFarbTableColorGradient2+","+htmlFarbTableColorGradient1+");\">";                                               
      const htmlTabStyleNone= "<table bordercolor=\""+htmlFarbTableBorderColor+"\" border=\"3\" cellspacing=\"3\" cellpadding=\"3\"  rules=\"none\" style=\"color:"+htmlFarbFelderschrift+";  font-size:"+htmlSchriftgroesse+
                            "; font-family:"+htmlSchriftart+";background-image: linear-gradient(42deg,"+htmlFarbTableColorGradient2+","+htmlFarbTableColorGradient1+");\">"; 
      const htmlTabUeber1="<tr style=\"color:"+htmlFarbTableColorUber+"; font-weight: bold\">";
      const htmlTabUeber3="</tr>";
      
      
      //NICHTS ÄNDERN - abhängig von den oben definierten _Spalten - in diesem Beispiel sind es 4
      
      var htmlTabUeber2="<td  align=center>&ensp;"+htmlFeld1+"&ensp;</td><td align=center>&ensp;"+htmlFeld2+"&ensp;</td><td  align=center>&ensp;"+htmlFeld3+"&ensp;</td><td align=center>&ensp;"+htmlFeld4+"&ensp;</td>";
      var htmlTabUeber2_1="<td  align=center style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld1+"&ensp;</td><td  align=center style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld2+
                         "&ensp;</td><td  align=center style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld3+"&ensp;</td><td  align=center style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld4+
                         "&ensp;</td>";
      //------------------------------------------------------
      
      
      var htmlOut="";
      var mix;
      var counter;
      var myIDArr=[];
      var warte;
      var myRememberList="";
      
      
      function writeHTML(){
      
           var htmlTabStyle;
         switch (+htmlRahmenLinien) { 
         case 1: htmlTabStyle=htmlTabStyleAll; break;
         case 2: htmlTabStyle=htmlTabStyleCol; break;
         case 3: htmlTabStyle=htmlTabStyleRow; break;
         case 4: htmlTabStyle=htmlTabStyleNone; break;
         
      };  
      
      htmlOut="";
      
      
      
      counter=-1;
      var htmlTabUeber="";
      switch (mehrfachTabelle) { 
         case 1: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber3;  break;
         case 2: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber2_1+htmlTabUeber3; break;
         case 3: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber2+htmlTabUeber2+htmlTabUeber3; break;
         case 4: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber2_1+htmlTabUeber2+htmlTabUeber2_1+htmlTabUeber3; break;
      };  
      
      //HIER SIND DIE § WERTE, DIE IN DER SCHLEIFE GEFILTERET WER%DEN - Jede spalte einen wert
      var val1; var val2; var val0; var val3; var valSort; var valID; var myListWerte=""; var myListAuswahl="";
      //------------------------------------------------------------
       setState(dPDELETE,0);
      var myArr=[]; var myList=""; var myListArr=[]; myIDArr=[];
      myListArr.push('0'+":"+'choose ...'+";");
                  myListWerte=myListWerte+"choose ..."+";";
                 myListAuswahl=myListAuswahl+(0+";");
                 myIDArr.push("dummy");
      $('alexa2.0.Lists.TO_DO.items.*.value').each(function(id, i) {           // hier eigene schleife definierenalexa2.0.Lists.SHOPPING_LIST.items.0f43141e-029c-4860-bcd0-828702b0dc86.value
                 
                 val0=getState(id).val;
                 val1=getState(id.replace("value","completed")).val; 
                 val2=valSort=getState(id.replace("value","updatedDateTime")).val; 
                 valID=getState(id.replace("value","id")).val; 
                 myIDArr.push(valID);
                 var yy= (Math.round((new Date()).getTime() / 1000))-Math.round(val2/1000);
                 val2=formatDate(getDateObject(val2), "TT.MM - SS:mm:ss")
                 val3=(Math.floor( ((yy)/60/60/24) )+"d "+ Math.floor(((yy)/60/60) % 24) +"h "+ Math.floor( ((yy)/60) % 60 )+" m")
                 //if (val1==false) {val1="❌"} else{val1="✅"}
                 if (val1==false) {val1="<input type='checkbox' id='getState(id).val' value='true'>"} else{val1="<input type='checkbox' id='getState(id).val'  value='false' checked='checked'>"}
                 myArr.push([val0,val1,val2,val3,valSort]);
                 val0=val0.replace(/,/g,'-');  
                 myListArr.push((i+1)+":"+val0+";");
                 myListWerte=myListWerte+val0+";";
                 myListAuswahl=myListAuswahl+(i+1)+";";          //if (val1==false) {val1="<input type='checkbox' id='getState(id).val' value='true'>"} else{val1="<input type='checkbox' id='getState(id).val'  value='false' checked='checked'>"}
                
      });
             
      
              //log (myListArr.toString());
             for (var x=0;x<myListArr.length;x++){
               myList=myList.concat(myListArr[x]);
              // log(myListArr[x]);
               //log(myList);
      
             }
             //log("-----------myList : "+myList)
             if(myList!=myRememberList){
                 setState(dPDELETEWert,myListWerte);
                 setState(dPDELETEAuswahl,myListAuswahl);
               var timeout = setTimeout(function () {
                  var obj = getObject(dPDELETE);
                  obj.common.states=myList;
                  myRememberList=myList;
                  log(myList);
                  setObject(dPDELETE, obj);
               }, 400);
             }
       //SORT
                       myArr.sort(function (alpha, beta) {
                    if (alpha[4] > beta[4])
                       return -11;
                    if (beta[4] > alpha[4])
                       return 1;
                    return 0;
                   });
      
        for (var x=0 ; x<myArr.length ; x++) {
            counter++;
           //HIER WERDEN DIE DATEN DER SCHLEIFE ZUSAMMENGESETZT - hat man oben 2 Felder definiert, braucht man hier 2 Werte
             val0=myArr[x][0];
             val1=myArr[x][1];
             val2=myArr[x][2];
             val3=myArr[x][3];
      
           //HIER WERDEN DIE DATEN DER SCHLEIFE ZUSAMMENGESETZT - hat man oben 4 Felder definiert, braucht man hier 4 Werte
         
             switch (mehrfachTabelle) {  
               case 1:                    htmlOut=htmlOut+"<tr><td>&ensp;"+val0+"&ensp;</td><td align=center>&ensp;"+val1+"&ensp;</td><td align=center>&ensp;"+val2+"&ensp;</td><td align=center>&ensp;"+val3+"&ensp;</td></tr>"; break;
              case 2:  if(counter%2==0)  {htmlOut = htmlOut+"<tr><td>&ensp;"+val0+"&ensp;</td><td align=center>&ensp;"+val1+"&ensp;</td><td align=center>&ensp;"+val2+"&ensp;</td><td align=center>&ensp;"+val3+"&ensp;</td>"; } 
                                    else {htmlOut = htmlOut+"<td style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val0+"&ensp;</td><td  align=center style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val1+"&ensp;</td><td  align=center style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val2+"&ensp;</td><td  align=center style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val3+"&ensp;</td></tr>";} break;
                                         
              case 3: if(counter%3==0 )  {htmlOut = htmlOut+"<tr><td>&ensp;"+val0+"&ensp;</td><td align=center>&ensp;"+val1+"&ensp;</td><td align=center>&ensp;"+val2+"&ensp;</td><td align=center>&ensp;"+val3+"&ensp;</td>"; } 
                                    else { if(counter%3==1 )  { htmlOut = htmlOut+"<td style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val0+"&ensp;</td><td  align=center style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val1+"&ensp;</td><td  align=center style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val2+"&ensp;</td><td  align=center style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val3+"&ensp;</td>";} 
                                                     else    {htmlOut = htmlOut+"<td>&ensp;"+val0+"&ensp;</td><td align=center>&ensp;&ensp;"+val1+"&ensp;</td><td align=center>&ensp;"+val2+"&ensp;</td><td align=center>&ensp;"+val3+"&ensp;</td></tr>";}
                                               } break;
      
      
              case 4: if(counter%4==0)  {htmlOut = htmlOut+"<tr><td>&ensp;"+val0+"&ensp;</td><td align=center>&ensp;"+val1+"&ensp;</td><td align=center>&ensp;"+val2+"&ensp;</td><td align=center>&ensp;"+val3+"&ensp;</td>"; } 
                                        else {if(counter%2==1 )  { htmlOut = htmlOut+"<td style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val0+"&ensp;</td><td  align=center style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val1+"&ensp;</td><td  align=center style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val2+"&ensp;</td><td  align=center style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val3+"&ensp;</td>";} 
                                                     else    {if(counter%2==1 && counter%4==3)  { htmlOut= htmlOut+"<td style=\"color:"+htmlFarbFelderschrift2+"\"&ensp;>"+val0+"&ensp;</td><td  align=center style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val1+"&ensp;</td><td align=center style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val2+"&ensp;</td><td  align=center style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val3+"&ensp;</td></tr>";} 
                                                                       else    {htmlOut = htmlOut = htmlOut+"<td>&ensp;"+val0+"&ensp;</td><td>&ensp;"+val1+"&ensp;</td><td align=center>&ensp;"+val2+"&ensp;</td><td align=center>&ensp;"+val3+"&ensp;</td>";}}
                                               } break;
      
           } //switch ende
      
          //---------------------------------------------
         }; //Schleifen ende
           // tabelle fertigstellen
             switch (mehrfachTabelle) {  
               case 1:    break;
               case 2:    mix=Math.abs(((counter+1)%2)-mehrfachTabelle);  
                          if(mix==1)  htmlOut = htmlOut.replace(/<\/td>$/, '</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>');       
                          break;
               case 3:    mix =Math.abs(((counter+1)%3)-mehrfachTabelle);
                          if(mix==1)  htmlOut = htmlOut.replace(/<\/td>$/, '</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>');       
                          if(mix==2)  htmlOut = htmlOut.replace(/<\/td>$/, '</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>');   
                          break;
               case 4:    mix=Math.abs(((counter+1)%4)-mehrfachTabelle);
                          if(mix==1)  htmlOut = htmlOut.replace(/<\/td>$/, '</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>');
                          if(mix==2)  htmlOut = htmlOut.replace(/<\/td>$/, '</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>');    
                          if(mix==3)  htmlOut = htmlOut.replace(/<\/td>$/, '</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;<td>&ensp;</td><td>&ensp;</td></td></tr>');      
                          break; }
           
                //Ausgabe über VIS html widget - tabelle in datenpunkt schreiben - html tabelle ohne html header und body
                 var htmlOutVIS="";
                 const htmlUeber=    "<p style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-weight: bold\">"+htmlFeldUeber+"&ensp;&ensp;&ensp;"+(counter+1)+"</p>";
                 htmlUberschrift ? htmlOutVIS=htmlUeber+htmlTabStyle+htmlTabUeber+htmlOut+"</table>" : htmlOutVIS=htmlTabStyle+htmlTabUeber+htmlOut+"</table>"
                 //log(htmlOutVIS);
                 if (braucheEinVISWidget) setState(dpVIS, htmlOutVIS );
      
       //mit oder ohne überschrift
       htmlUberschrift ? htmlOut=htmlStart+htmlUeber+htmlTabStyle+htmlTabUeber+htmlOut+htmlEnd : htmlOut=htmlStart+htmlTabStyle+htmlTabUeber+htmlOut+htmlEnd;
       //log(htmlOut);
      } // function ende
      
      //hier wird schleife gestartet und das file geschrieben
       
      schedule(mySchedule,  function () {
       writeHTML();
       if (braucheEinFile) {writeFile(home, path ,htmlOut, function (error) { /* log('file written');*/  });}
      }); 
      writeHTML();
      
      on({id: dPDELETE, ack: false, change: "ne"}, function (obj) { 
      
         let a=getState(dPDELETE).val;
         if (a!=0){
         let toDelete=myIDArr[getState(dPDELETE).val];
         var stateHelp="alexa2.0.Lists.TO_DO.items."+toDelete+".#delete"
         setState(stateHelp,true);
         var timeout = setTimeout(function () {
         writeHTML(); }, 2000);
         }
         log(a+stateHelp)
         });
      
         on({id: dpANLEGEN, ack: false, change: "ne"}, function (obj) { 
             log(getState(dpANLEGEN).val);
          setState("alexa2.0.Lists.TO_DO.#New",getState(dpANLEGEN).val)
             var timeout = setTimeout(function () {
         writeHTML(); }, 2000);
         });
      
      
      
      
      

      nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

      1 Antwort Letzte Antwort
      0
      • OliverIOO OliverIO

        @liv-in-sky
        Schau mal hier. Da ist das Prinzip sichtbar.
        https://stackoverflow.com/questions/2055459/dynamically-create-checkbox-with-jquery-from-text-input

        liv-in-skyL Offline
        liv-in-skyL Offline
        liv-in-sky
        schrieb am zuletzt editiert von
        #6

        @OliverIO und diese art von script gehört dann in den scipt-tab der vis - richtig ?

        nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

        1 Antwort Letzte Antwort
        0
        • OliverIOO Offline
          OliverIOO Offline
          OliverIO
          schrieb am zuletzt editiert von
          #7

          ne da geht das nicht. bei den server skripten steht dir jquery nicht zur Verfügung geschweige die Browserlogik zur Verarbeitung. Dann musst du den Text schreiben, genauso wie du das mit der Tabelle bei
          // Hier NICHTS ÄNDERN
          gemacht hast.

          Meine Adapter und Widgets
          TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
          Links im Profil

          1 Antwort Letzte Antwort
          0
          • OliverIOO Offline
            OliverIOO Offline
            OliverIO
            schrieb am zuletzt editiert von
            #8

            den code, den ich gepostet habe, kannst du im vis entweder im skript-tab unterbringen
            oder besser in einem HTML-Widget in entsprechenden script-tags. da kannst du dann auch den entsprechenden container mit einbauen, auf das sich das skript beziehen muss.

            Meine Adapter und Widgets
            TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
            Links im Profil

            liv-in-skyL 2 Antworten Letzte Antwort
            0
            • OliverIOO OliverIO

              den code, den ich gepostet habe, kannst du im vis entweder im skript-tab unterbringen
              oder besser in einem HTML-Widget in entsprechenden script-tags. da kannst du dann auch den entsprechenden container mit einbauen, auf das sich das skript beziehen muss.

              liv-in-skyL Offline
              liv-in-skyL Offline
              liv-in-sky
              schrieb am zuletzt editiert von
              #9

              @OliverIO kann man dann in einem script, welches in einem html widget liegt, über binding auf die datenpunkte zugreifen

              nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

              1 Antwort Letzte Antwort
              0
              • OliverIOO OliverIO

                den code, den ich gepostet habe, kannst du im vis entweder im skript-tab unterbringen
                oder besser in einem HTML-Widget in entsprechenden script-tags. da kannst du dann auch den entsprechenden container mit einbauen, auf das sich das skript beziehen muss.

                liv-in-skyL Offline
                liv-in-skyL Offline
                liv-in-sky
                schrieb am zuletzt editiert von liv-in-sky
                #10

                @OliverIO

                ich muss also checkboxen in meinem script erzeugen - dynamisch - verschiedene id's
                dann noch einen datenpunkt beschreiben der ein script enthält, was diese checkboxen mit variabler id bei click abfangen (also muss mein script auch noch ein 2tes script erzeugen - welches in den datenpunkt für das htmlwidget schreibt)
                dann müssen auch noch die datenpunkte geschaltet werden, anhand der id der checkboxen - weil die id ja von den alexa items abgekupfert ist

                sehe ich das so ungefähr richtig

                nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

                1 Antwort Letzte Antwort
                0
                • OliverIOO Offline
                  OliverIOO Offline
                  OliverIO
                  schrieb am zuletzt editiert von
                  #11

                  also schreiben von states aus vis:

                  function setzeWert(variablenName, Wert){
                     this.servConn._socket.emit('setState', variablenName, Wert);
                  }
                  

                  lesen von states
                  da vis da einen besonderen mechanismus hat, würde ich unsichtbare widgets setzen mit den zu lesenden datenpunkten. diese kannst du dann mit jquery lesen. da kann man auch events drauf setzen, wenn sich der wert des datenpunkt ändert.

                  erzeugen von dynamischen checkboxen:
                  ich habe dir hier mal ein htlm widget gebaut, das bei jeden knopfdruck ein neue checkbox erzeugt

                  [{"tpl":"tplHtml","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"html":"<div id=\"cblist\">\n\n</div>\n<input type=\"button\" value=\"add\" id=\"btnSave\" />\n\n<script type=\"text/javascript\">\n$(document).ready(function() {\n    $('#btnSave').click(function() {\n        addCheckbox('newcb');\n    });\n});\n\nfunction addCheckbox(name) {\n   var container = $('#cblist');\n   var inputs = container.find('input');\n   var id = inputs.length+1;\ndebugger;\n   $('<input />', { \n       type: 'checkbox', \n       id: 'cb'+id, \n       value: name \n       \n   }).appendTo(container);\n   $('<label />', { \n       'for': 'cb'+id, \n       text: name \n       \n   }).appendTo(container);\n}\n</script>"},"style":{"left":"216px","top":"142px"},"widgetSet":"basic"}]
                  

                  der obige code geht direkt so nicht als cutnpaste, da der code durch eval geschickt wird und das hat wohl probleme mit der objekt-notation in einer zeile

                  Meine Adapter und Widgets
                  TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
                  Links im Profil

                  liv-in-skyL 1 Antwort Letzte Antwort
                  1
                  • OliverIOO OliverIO

                    also schreiben von states aus vis:

                    function setzeWert(variablenName, Wert){
                       this.servConn._socket.emit('setState', variablenName, Wert);
                    }
                    

                    lesen von states
                    da vis da einen besonderen mechanismus hat, würde ich unsichtbare widgets setzen mit den zu lesenden datenpunkten. diese kannst du dann mit jquery lesen. da kann man auch events drauf setzen, wenn sich der wert des datenpunkt ändert.

                    erzeugen von dynamischen checkboxen:
                    ich habe dir hier mal ein htlm widget gebaut, das bei jeden knopfdruck ein neue checkbox erzeugt

                    [{"tpl":"tplHtml","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"html":"<div id=\"cblist\">\n\n</div>\n<input type=\"button\" value=\"add\" id=\"btnSave\" />\n\n<script type=\"text/javascript\">\n$(document).ready(function() {\n    $('#btnSave').click(function() {\n        addCheckbox('newcb');\n    });\n});\n\nfunction addCheckbox(name) {\n   var container = $('#cblist');\n   var inputs = container.find('input');\n   var id = inputs.length+1;\ndebugger;\n   $('<input />', { \n       type: 'checkbox', \n       id: 'cb'+id, \n       value: name \n       \n   }).appendTo(container);\n   $('<label />', { \n       'for': 'cb'+id, \n       text: name \n       \n   }).appendTo(container);\n}\n</script>"},"style":{"left":"216px","top":"142px"},"widgetSet":"basic"}]
                    

                    der obige code geht direkt so nicht als cutnpaste, da der code durch eval geschickt wird und das hat wohl probleme mit der objekt-notation in einer zeile

                    liv-in-skyL Offline
                    liv-in-skyL Offline
                    liv-in-sky
                    schrieb am zuletzt editiert von
                    #12

                    @OliverIO wow - vielen dank, dass du dir die arbeit gemacht hast - aber das ist mir zu hoch für den moment - da muss ich erstmmal mit ganz einfachen sachen beginnen, um da dahinter zu steigen

                    deshalb

                    sorry - @senger1985 - da bin ich raus - da bleibe ich bei der jetzigen script variante

                    nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

                    S 1 Antwort Letzte Antwort
                    0
                    • liv-in-skyL liv-in-sky

                      @OliverIO wow - vielen dank, dass du dir die arbeit gemacht hast - aber das ist mir zu hoch für den moment - da muss ich erstmmal mit ganz einfachen sachen beginnen, um da dahinter zu steigen

                      deshalb

                      sorry - @senger1985 - da bin ich raus - da bleibe ich bei der jetzigen script variante

                      S Offline
                      S Offline
                      senger1985
                      schrieb am zuletzt editiert von
                      #13

                      @liv-in-sky das übersteigt auch "leicht" meine Skills.
                      Das erzeugen der Checkboxen, je nachdem wie viele Artikel auf der Liste sind, habe ich ja hinbekommen, aber die Zuweisung, zu den Datenpunkten, um die Artikel dann von der Liste zu streichen, ist mir dann auch ein wenig zu hoch.

                      Aber danke an @OliverIO für die Mühe, das zu erklären.

                      1 Antwort Letzte Antwort
                      0
                      • OliverIOO Offline
                        OliverIOO Offline
                        OliverIO
                        schrieb am zuletzt editiert von
                        #14

                        @liv-in-sky @senger1985
                        wenn ihr Interesse habt, könnt ihr ja mal ein tutorial machen
                        https://www.w3schools.com/jquery/default.asp

                        so schwer ist es nicht und man kann mit ein paar wenigen befehlen schnell Ergebnisse erreichen.
                        Mit dem eingebauten Debugger in chrome und firefox kann man die befehle dann sogar schrittweise abarbeiten und schauen was da im einzelnen passiert

                        wie gesagt jquery ist in vis schon eingebaut

                        Meine Adapter und Widgets
                        TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
                        Links im Profil

                        S 1 Antwort Letzte Antwort
                        1
                        • OliverIOO OliverIO

                          @liv-in-sky @senger1985
                          wenn ihr Interesse habt, könnt ihr ja mal ein tutorial machen
                          https://www.w3schools.com/jquery/default.asp

                          so schwer ist es nicht und man kann mit ein paar wenigen befehlen schnell Ergebnisse erreichen.
                          Mit dem eingebauten Debugger in chrome und firefox kann man die befehle dann sogar schrittweise abarbeiten und schauen was da im einzelnen passiert

                          wie gesagt jquery ist in vis schon eingebaut

                          S Offline
                          S Offline
                          senger1985
                          schrieb am zuletzt editiert von
                          #15

                          @OliverIO danke dir, für den Link und ich werde ihn mir anschauen.
                          jQuery ist mir aus meinen damaligen Programmierzeiten auch noch etwas bekannt, aber ganz weit hinten, in meinem Kopf.

                          Es geht halt gerade speziell darum, Checkboxen automatisch zu generieren(was ich geschafft habe), aber dann die ID des Artikels, der auf der Alexa2-Einkaufsliste steht, mit einzubeziehen, um den Datenpunkt "completed" auf "true" zu setzen.

                          1 Antwort Letzte Antwort
                          0
                          Antworten
                          • In einem neuen Thema antworten
                          Anmelden zum Antworten
                          • Älteste zuerst
                          • Neuste zuerst
                          • Meiste Stimmen


                          Support us

                          ioBroker
                          Community Adapters
                          Donate

                          829

                          Online

                          32.4k

                          Benutzer

                          81.5k

                          Themen

                          1.3m

                          Beiträge
                          Community
                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                          ioBroker Community 2014-2025
                          logo
                          • Anmelden

                          • Du hast noch kein Konto? Registrieren

                          • Anmelden oder registrieren, um zu suchen
                          • Erster Beitrag
                            Letzter Beitrag
                          0
                          • Home
                          • Aktuell
                          • Tags
                          • Ungelesen 0
                          • Kategorien
                          • Unreplied
                          • Beliebt
                          • GitHub
                          • Docu
                          • Hilfe