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. Visualisierung
  4. Sprung von materialdesign Table auf anderen Seite

NEWS

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

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

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

Sprung von materialdesign Table auf anderen Seite

Geplant Angeheftet Gesperrt Verschoben Visualisierung
25 Beiträge 3 Kommentatoren 2.3k Aufrufe 2 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.
  • MoppedmanM Moppedman

    @Scrounger oder alle anderen Erfahrenen im Forum

    Ich möchte was realisieren weiß aber nicht ob das überhaupt geht. Da ich meine VIS nahezu komplett auf deinem Material Design incl. Top App Bar aufsetzt habe (klasse Arbeit, Danke dafür) würde ich mich freuen wenn du mir einen Hinweis geben könntest.
    Ich habe die unkomfortable EXCEL Liste unserer Whisky-Gruppe in mySQL überführt. Die DB läuft nun auf meinem raspPI in eine eigene Instanz (sql.1) zusammen mit IOB. In der VIS habe ich verschieden Seiten erstellt in denen wir Eingaben zur Bewertung machen können

    25639037-0112-40b2-a3d0-0cf5f4633f58-grafik.png

    oder uns Ranking, Bestand und anderes Anzeigen lassen können.

    Der User kann auf einer Seite in der Datenbank einen Whisky nach bestimmten Kriterien suchen lassen. Ich bauen dafür auf seinen Eingaben eine Query zusammen und frage dann diese an der DB ab und zeige das Suchergebnis dann in deiner „materialdesign - Table“ an. Funz´t alles klasse.

    c2a66447-bfee-49b3-8ae6-bdd131114f88-grafik.png

    Wenn ein User für einen gefundenen Whisky nun aber Einträge ändern will, muss er sich die angezeigte DB-ID (ganz rechts) merken, zurück auf die Seite „Eingabe“ wechseln, die DB-ID und "Bewerter" eingeben und von der DB neu laden.

    Mein Wunsch wäre es irgendwie aus der „materialdesign - Table“ eine Zeile Auszuwählen und von dort direkt auf die Seite „Eingabe“ zu springen und dabei direkt die „DB-ID“ und den „Bewerter“ zu übergeben. Eine "Luxus Version" würde dem User sogar erlauben in einer Auswahl die Seite angebn zu können wohin er springen will (Eingabe, ScoreCard)

    Kannst du (oder natürlich alle die eine Idee haben ) dazu eine Lösung anbieten.

    ScroungerS Offline
    ScroungerS Offline
    Scrounger
    Developer
    schrieb am zuletzt editiert von
    #3

    @moppedman
    Das kannst unter Verwendung der HTML Widgets realisieren.
    Z.b. kannst nen Link Button nehmen und dann eine entsprechende Seite aufrufen.
    Oder du nimmst z.B. einen state Button und schreibst mit dem die ID in einen Datenpunkt. Jetzt könntest du auf die Änderung dieses Datenpunktes per Javascript hören und dann gleich per Vis ne Seite öffnen oder per topappbar wechseln, wo dann die Eingabe Maske zur Bewertung ist. Die ID auf der Seite Holst dir dann auch aus dem Datenpunkt.

    Schau Mal in die Doku da ist erklärt wie man die HTML Widgets anwendet. Wenn's klemmt einfach melden.

    <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

    <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

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

      @moppedman

      evtl wartest du auf @Scrounger - der ist damit besser vertraut

      ich habe mal getestet

      man bekommt den text schon raus , aus der tabelle - dann muss halt nur noch die richtige function dahinter (im beispiel wird ein browser alert ausgegeben), damit das passiert, was du dir vorstellst

      das beispiel:

      AApossis (175).gif

      MoppedmanM Offline
      MoppedmanM Offline
      Moppedman
      schrieb am zuletzt editiert von
      #4

      Hi @liv-in-sky

      Danke für die schnelle Antwort. Das Gute ist schon mal das du genau verstanden hast was ich will. War mir da nicht sicher ob ich das verständlich genug beschrieben hatte.

      Könntest du mal bitte die Code Schnipse zu deinem Beispiel teilen, denn ich würde gerne verstehen wie du das gemacht hast. Ich vermute du hast wohl "mouseover" und "click" verwendet und dann irgendwie die Daten aus der Tabelle in das Alert Fenster eingetragen. Habe keine Vorstellung wie du das im Detail gemacht hast.

      Gruß aus dem rheinischen

      liv-in-skyL 1 Antwort Letzte Antwort
      0
      • MoppedmanM Moppedman

        Hi @liv-in-sky

        Danke für die schnelle Antwort. Das Gute ist schon mal das du genau verstanden hast was ich will. War mir da nicht sicher ob ich das verständlich genug beschrieben hatte.

        Könntest du mal bitte die Code Schnipse zu deinem Beispiel teilen, denn ich würde gerne verstehen wie du das gemacht hast. Ich vermute du hast wohl "mouseover" und "click" verwendet und dann irgendwie die Daten aus der Tabelle in das Alert Fenster eingetragen. Habe keine Vorstellung wie du das im Detail gemacht hast.

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

        @moppedman

        nee - ist jquery - evtl ist das von @Scrounger einfacher

        das hier in script tab des vis-editors

        Image 2.png

        
        function waitForElement(parent, elementPath, wid, widgetName, callBack, counter = 0, debug = false) {
        
                if (counter < 30) {
        
                    setTimeout(function () {
        
                        if (parent.find(elementPath).length > 0) {
        
                            if (debug) console.log(`[${widgetName} ${wid}] it took ${counter}ms to wait for the element '${elementPath}'`);
        
                            callBack();
        
                        } else {
        
                            if (debug) console.log(`[${widgetName} ${wid}] wait for element '${elementPath}'`);
        
                            counter++
        
                            waitForElement(parent, elementPath, wid, widgetName, callBack, counter, debug);
        
                        }
        
                    }, 1000);
        
                } else {
        
                   if (debug) console.warn(`[${widgetName} ${wid}] stop waiting after ${counter} retries`);
        
                    callBack();
        
               }
        
           }
        
        
          waitForElement($('body'),'#w00360', 'dummy', 'dummy', function () {
        
          // Widget ist geladen, auf das Widget klicken, w02705 ist die ID von meinem basic - Screen Resolution Widget
        
         console.log("jetzt")
        
         $("[id$='col2']").click(function() {
             var matches = this.id; 
              var matches2 = $(this).text(); 
              alert(matches+matches2);
              vis.setValue('0_userdata.0.CONTROL-OWN.AAATEST.whiskey-id',matches2.trim()); 
         });  /*});*/
         
         $(".mdc-data-table__header-cell").click(function() {
             console.log("sort");
         $("[id$='col2']").click(function() {
             var matches = this.id; 
              var matches2 = $(this).text(); 
              alert(matches+matches2);
              vis.setValue('0_userdata.0.CONTROL-OWN.AAATEST.whiskey-id',matches2.trim());
         }); });
        
         /*  }, 3000);*/
        
        }, 0, true);
        

        dann wichtig: es muss was angeglichen werden (zeilen beziehen sich auf zeilennummer im forum - code-tag) :

        • zeile 37 muss deine widget-id rein anstatt "w00360"
        • zeile 43 muss deine spalte rein - die der id

        damit solltest du dann testen können

        der nächste schritt ist dann:

        • einen dp erstellen und in unserer funktion die gefundene id in den dp schreiben - damit du dein script triggern kannst um etwas anderes in der vis anzuzeigen

        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

        MoppedmanM 1 Antwort Letzte Antwort
        0
        • ScroungerS Scrounger

          @moppedman
          Das kannst unter Verwendung der HTML Widgets realisieren.
          Z.b. kannst nen Link Button nehmen und dann eine entsprechende Seite aufrufen.
          Oder du nimmst z.B. einen state Button und schreibst mit dem die ID in einen Datenpunkt. Jetzt könntest du auf die Änderung dieses Datenpunktes per Javascript hören und dann gleich per Vis ne Seite öffnen oder per topappbar wechseln, wo dann die Eingabe Maske zur Bewertung ist. Die ID auf der Seite Holst dir dann auch aus dem Datenpunkt.

          Schau Mal in die Doku da ist erklärt wie man die HTML Widgets anwendet. Wenn's klemmt einfach melden.

          MoppedmanM Offline
          MoppedmanM Offline
          Moppedman
          schrieb am zuletzt editiert von
          #6

          Hi @scrounger

          danke für die schnelle Rückmeldung. Ich bin mir nicht sicher ob du ganz verstanden hast was ich will. Den Sprung über einen Link Button oder Button State kriege ich schon hin, was mir fehlt ist aber wie ich an die Daten aus der "Table" komme dessen Zeile gerade vom USER angeclickt wurde.

          @liv-in-sky hat das in seiner Antwort im Thread mit einem guten Beispiel dargestellt. Habe ihn schon gebeten den Code mal zu teilen.

          Da ich vor allem an einem iPad die Daten eingebe ist ein "Mouse-Click" nicht möglich. Müsste dann ein "doubbleTap" oder was ähnliches sein.

          Wie komme ich also an den Dateneintrag der Colum "DB-ID" des über "mouse Over" angewählten Zeile in der "Table"

          Gruß aus dem rheinischen

          liv-in-skyL ScroungerS 3 Antworten Letzte Antwort
          0
          • MoppedmanM Moppedman

            Hi @scrounger

            danke für die schnelle Rückmeldung. Ich bin mir nicht sicher ob du ganz verstanden hast was ich will. Den Sprung über einen Link Button oder Button State kriege ich schon hin, was mir fehlt ist aber wie ich an die Daten aus der "Table" komme dessen Zeile gerade vom USER angeclickt wurde.

            @liv-in-sky hat das in seiner Antwort im Thread mit einem guten Beispiel dargestellt. Habe ihn schon gebeten den Code mal zu teilen.

            Da ich vor allem an einem iPad die Daten eingebe ist ein "Mouse-Click" nicht möglich. Müsste dann ein "doubbleTap" oder was ähnliches sein.

            Wie komme ich also an den Dateneintrag der Colum "DB-ID" des über "mouse Over" angewählten Zeile in der "Table"

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

            @moppedman

            jquery reagiert mit meinem script (im pc browser, apple habe ich nicht) auf einen click (zeile 43))- im sccript muss dann eine zeile eingefügt werden, die einen dp im iobroker setzt - dann hast du die id, oder zeile - oder spalte

            der befehl heißt zb.:

            vis.setValue('0_userdata.0.CONTROL-OWN.AAATESTwhiskey-id',matches2);
            

            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
            • MoppedmanM Moppedman

              Hi @scrounger

              danke für die schnelle Rückmeldung. Ich bin mir nicht sicher ob du ganz verstanden hast was ich will. Den Sprung über einen Link Button oder Button State kriege ich schon hin, was mir fehlt ist aber wie ich an die Daten aus der "Table" komme dessen Zeile gerade vom USER angeclickt wurde.

              @liv-in-sky hat das in seiner Antwort im Thread mit einem guten Beispiel dargestellt. Habe ihn schon gebeten den Code mal zu teilen.

              Da ich vor allem an einem iPad die Daten eingebe ist ein "Mouse-Click" nicht möglich. Müsste dann ein "doubbleTap" oder was ähnliches sein.

              Wie komme ich also an den Dateneintrag der Colum "DB-ID" des über "mouse Over" angewählten Zeile in der "Table"

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

              @moppedman

              AApossis (178).gif

              Image 4.png

              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

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

                @moppedman

                AApossis (178).gif

                Image 4.png

                MoppedmanM Offline
                MoppedmanM Offline
                Moppedman
                schrieb am zuletzt editiert von
                #9

                Vielen Dank @liv-in-sky

                Ich habe leider beruflich bedingt erst in 14 Tagen Zeit mir das mit der notwendigen Ruhe anzuschauen. Melde mich ob ich es hinbekommen habe.

                Schönes Rest-Wochenende

                Gruß aus dem rheinischen

                1 Antwort Letzte Antwort
                0
                • MoppedmanM Moppedman

                  Hi @scrounger

                  danke für die schnelle Rückmeldung. Ich bin mir nicht sicher ob du ganz verstanden hast was ich will. Den Sprung über einen Link Button oder Button State kriege ich schon hin, was mir fehlt ist aber wie ich an die Daten aus der "Table" komme dessen Zeile gerade vom USER angeclickt wurde.

                  @liv-in-sky hat das in seiner Antwort im Thread mit einem guten Beispiel dargestellt. Habe ihn schon gebeten den Code mal zu teilen.

                  Da ich vor allem an einem iPad die Daten eingebe ist ein "Mouse-Click" nicht möglich. Müsste dann ein "doubbleTap" oder was ähnliches sein.

                  Wie komme ich also an den Dateneintrag der Colum "DB-ID" des über "mouse Over" angewählten Zeile in der "Table"

                  ScroungerS Offline
                  ScroungerS Offline
                  Scrounger
                  Developer
                  schrieb am zuletzt editiert von
                  #10

                  @moppedman sagte in Sprung von materialdesign Table auf anderen Seite:

                  Hi @scrounger

                  danke für die schnelle Rückmeldung. Ich bin mir nicht sicher ob du ganz verstanden hast was ich will. Den Sprung über einen Link Button oder Button State kriege ich schon hin, was mir fehlt ist aber wie ich an die Daten aus der "Table" komme dessen Zeile gerade vom USER angeclickt wurde.

                  Doch hab verstanden was du machen willst. Wie gesagt kannst dir per Script das json für deine Tabelle bauen und dort ein HTML wider Button state einbauen, das dann die ID verwendet.
                  Die Losung @liv-in-sky geht natürlich auch

                  <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

                  <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

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

                    @moppedman

                    nee - ist jquery - evtl ist das von @Scrounger einfacher

                    das hier in script tab des vis-editors

                    Image 2.png

                    
                    function waitForElement(parent, elementPath, wid, widgetName, callBack, counter = 0, debug = false) {
                    
                            if (counter < 30) {
                    
                                setTimeout(function () {
                    
                                    if (parent.find(elementPath).length > 0) {
                    
                                        if (debug) console.log(`[${widgetName} ${wid}] it took ${counter}ms to wait for the element '${elementPath}'`);
                    
                                        callBack();
                    
                                    } else {
                    
                                        if (debug) console.log(`[${widgetName} ${wid}] wait for element '${elementPath}'`);
                    
                                        counter++
                    
                                        waitForElement(parent, elementPath, wid, widgetName, callBack, counter, debug);
                    
                                    }
                    
                                }, 1000);
                    
                            } else {
                    
                               if (debug) console.warn(`[${widgetName} ${wid}] stop waiting after ${counter} retries`);
                    
                                callBack();
                    
                           }
                    
                       }
                    
                    
                      waitForElement($('body'),'#w00360', 'dummy', 'dummy', function () {
                    
                      // Widget ist geladen, auf das Widget klicken, w02705 ist die ID von meinem basic - Screen Resolution Widget
                    
                     console.log("jetzt")
                    
                     $("[id$='col2']").click(function() {
                         var matches = this.id; 
                          var matches2 = $(this).text(); 
                          alert(matches+matches2);
                          vis.setValue('0_userdata.0.CONTROL-OWN.AAATEST.whiskey-id',matches2.trim()); 
                     });  /*});*/
                     
                     $(".mdc-data-table__header-cell").click(function() {
                         console.log("sort");
                     $("[id$='col2']").click(function() {
                         var matches = this.id; 
                          var matches2 = $(this).text(); 
                          alert(matches+matches2);
                          vis.setValue('0_userdata.0.CONTROL-OWN.AAATEST.whiskey-id',matches2.trim());
                     }); });
                    
                     /*  }, 3000);*/
                    
                    }, 0, true);
                    

                    dann wichtig: es muss was angeglichen werden (zeilen beziehen sich auf zeilennummer im forum - code-tag) :

                    • zeile 37 muss deine widget-id rein anstatt "w00360"
                    • zeile 43 muss deine spalte rein - die der id

                    damit solltest du dann testen können

                    der nächste schritt ist dann:

                    • einen dp erstellen und in unserer funktion die gefundene id in den dp schreiben - damit du dein script triggern kannst um etwas anderes in der vis anzuzeigen
                    MoppedmanM Offline
                    MoppedmanM Offline
                    Moppedman
                    schrieb am zuletzt editiert von Moppedman
                    #11

                    @liv-in-sky

                    Hi,

                    hatte eben doch Zeit mir das schon mal anzuschauen, habs aber noch nicht ans laufen gekriegt.

                    Das mit der widget Nr in Zeile 37 ist mir klar und habe ich gemacht.

                    Hänge daran wie ich die id in Zeile 43 eintrage.

                    Die Spalte im VIEW der Datenbank die ich abfrage heisst 'id' die ich aber mit dem Statement AS 'Datenbank_ID' umbenenne. Im Table Widget von SCOUNGER ändere ich die Spalte aber noch einal auf DB-ID damit sie nicht so breit wird.

                    Habe also mehrere Möglichkeiten an Namen, würde aber von "Datenbank_ID" ausgehen. Weiterhinhabe ich nicht verstanden was ich in der Zeile

                              $("[id^=cell-row]").click(function() {
                    

                    genau ersetzen muss. nur "id" ??
                    was ist mit dem " ^=cell-row]" . Bleibt das genau so stehen?

                    $("[Datenbank_ID^=cell-row]").click(function() {

                    funktioniert jedenfalls so bei mir nicht. Habe das mal versucht zu googeln aber habe kein Beispiel mit [ ] Klammern gefunden. Habe noch kleinerlei Erfahrung mit jquery und daher ist mir die Syntax unbekannt.

                    Wäre nett wenn du das noch was genauer schreiben könntenst.
                    Schlussendlich habe ich das Table-Widget angeklickt das ich durchsuchen will und unter dem Reiter "SCRIPTE" das eingefügt. Gehe davon aus das das richtig war, ist aber besser wenn du das noch mal kurz bestätigen würdest.

                    Noch eine Ergänzung: Habe mal in der Firefox Konsole geschaut was da zu sehen ist. Hier der ScreenShot. W00685 ist die Widget id meiner Table und sollte daher passen.

                    b5ccaf1a-7f3c-417e-b9a6-430a143f4fa8-grafik.png

                    Gruß aus dem rheinischen

                    liv-in-skyL 1 Antwort Letzte Antwort
                    0
                    • MoppedmanM Moppedman

                      @liv-in-sky

                      Hi,

                      hatte eben doch Zeit mir das schon mal anzuschauen, habs aber noch nicht ans laufen gekriegt.

                      Das mit der widget Nr in Zeile 37 ist mir klar und habe ich gemacht.

                      Hänge daran wie ich die id in Zeile 43 eintrage.

                      Die Spalte im VIEW der Datenbank die ich abfrage heisst 'id' die ich aber mit dem Statement AS 'Datenbank_ID' umbenenne. Im Table Widget von SCOUNGER ändere ich die Spalte aber noch einal auf DB-ID damit sie nicht so breit wird.

                      Habe also mehrere Möglichkeiten an Namen, würde aber von "Datenbank_ID" ausgehen. Weiterhinhabe ich nicht verstanden was ich in der Zeile

                                $("[id^=cell-row]").click(function() {
                      

                      genau ersetzen muss. nur "id" ??
                      was ist mit dem " ^=cell-row]" . Bleibt das genau so stehen?

                      $("[Datenbank_ID^=cell-row]").click(function() {

                      funktioniert jedenfalls so bei mir nicht. Habe das mal versucht zu googeln aber habe kein Beispiel mit [ ] Klammern gefunden. Habe noch kleinerlei Erfahrung mit jquery und daher ist mir die Syntax unbekannt.

                      Wäre nett wenn du das noch was genauer schreiben könntenst.
                      Schlussendlich habe ich das Table-Widget angeklickt das ich durchsuchen will und unter dem Reiter "SCRIPTE" das eingefügt. Gehe davon aus das das richtig war, ist aber besser wenn du das noch mal kurz bestätigen würdest.

                      Noch eine Ergänzung: Habe mal in der Firefox Konsole geschaut was da zu sehen ist. Hier der ScreenShot. W00685 ist die Widget id meiner Table und sollte daher passen.

                      b5ccaf1a-7f3c-417e-b9a6-430a143f4fa8-grafik.png

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

                      @moppedman sagte in Sprung von materialdesign Table auf anderen Seite:

                      Schlussendlich habe ich das Table-Widget angeklickt das ich durchsuchen will und unter dem Reiter "SCRIPTE" das eingefügt. Gehe davon aus das das richtig war, ist aber besser wenn du das noch mal kurz bestätigen würdest.

                      ja - gehört in den scripte tab

                      das mit zeile 43 habe ich nicht richtig erklärt

                      damit du nur werte zurück bekommst, die in einer bestimmten spalte sind - die spalte mit der whisky-id, muss auch sichergestellt sein, dass du nur die spalte angibst - und auch nur dort getriggert wird - und nicht bei allen anderen spalten - du musst nur die zahl hinter col ändern

                      habe nochmal getestet - und bei der spalte 0 (beginnt bei 0) muss dort folg. stehen:
                      für die 1te spalte

                       $("[id$='col0']").click(function() {
                      

                      für die 3te spalte:

                       $("[id$='col2']").click(function() {
                      

                      usw.

                      habe aber ein problem entdeckt - wenn man eine spalte sortiert, funktioniert das ganze nicht mehr - daher muss du diese funktion austauschen - und wieder das widget angleichen!

                        waitForElement($('body'),'#w00360', 'dummy', 'dummy', function () {
                      
                        // Widget ist geladen, auf das Widget klicken, w02705 ist die ID von meinem basic - Screen Resolution Widget
                      
                       console.log("jetzt")
                      
                       $("[id$='col2']").click(function() {
                           var matches = this.id; 
                            var matches2 = $(this).text(); 
                            alert(matches+matches2);
                            vis.setValue('0_userdata.0.CONTROL-OWN.AAATEST.whiskey-id',matches2.trim()); 
                       });  /*});*/
                       
                       $(".mdc-data-table__header-cell").click(function() {
                           console.log("sort");
                       $("[id$='col2']").click(function() {
                           var matches = this.id; 
                            var matches2 = $(this).text(); 
                            alert(matches+matches2);
                            vis.setValue('0_userdata.0.CONTROL-OWN.AAATEST.whiskey-id',matches2.trim());
                       }); });
                      
                       /*  }, 3000);*/
                      
                      }, 0, true);
                      

                      ich habe im oberen post - mit dem script - auch alles ausgetauscht

                      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

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

                        @moppedman sagte in Sprung von materialdesign Table auf anderen Seite:

                        Schlussendlich habe ich das Table-Widget angeklickt das ich durchsuchen will und unter dem Reiter "SCRIPTE" das eingefügt. Gehe davon aus das das richtig war, ist aber besser wenn du das noch mal kurz bestätigen würdest.

                        ja - gehört in den scripte tab

                        das mit zeile 43 habe ich nicht richtig erklärt

                        damit du nur werte zurück bekommst, die in einer bestimmten spalte sind - die spalte mit der whisky-id, muss auch sichergestellt sein, dass du nur die spalte angibst - und auch nur dort getriggert wird - und nicht bei allen anderen spalten - du musst nur die zahl hinter col ändern

                        habe nochmal getestet - und bei der spalte 0 (beginnt bei 0) muss dort folg. stehen:
                        für die 1te spalte

                         $("[id$='col0']").click(function() {
                        

                        für die 3te spalte:

                         $("[id$='col2']").click(function() {
                        

                        usw.

                        habe aber ein problem entdeckt - wenn man eine spalte sortiert, funktioniert das ganze nicht mehr - daher muss du diese funktion austauschen - und wieder das widget angleichen!

                          waitForElement($('body'),'#w00360', 'dummy', 'dummy', function () {
                        
                          // Widget ist geladen, auf das Widget klicken, w02705 ist die ID von meinem basic - Screen Resolution Widget
                        
                         console.log("jetzt")
                        
                         $("[id$='col2']").click(function() {
                             var matches = this.id; 
                              var matches2 = $(this).text(); 
                              alert(matches+matches2);
                              vis.setValue('0_userdata.0.CONTROL-OWN.AAATEST.whiskey-id',matches2.trim()); 
                         });  /*});*/
                         
                         $(".mdc-data-table__header-cell").click(function() {
                             console.log("sort");
                         $("[id$='col2']").click(function() {
                             var matches = this.id; 
                              var matches2 = $(this).text(); 
                              alert(matches+matches2);
                              vis.setValue('0_userdata.0.CONTROL-OWN.AAATEST.whiskey-id',matches2.trim());
                         }); });
                        
                         /*  }, 3000);*/
                        
                        }, 0, true);
                        

                        ich habe im oberen post - mit dem script - auch alles ausgetauscht

                        MoppedmanM Offline
                        MoppedmanM Offline
                        Moppedman
                        schrieb am zuletzt editiert von
                        #13

                        @liv-in-sky

                        bekomme die Fehlermeldung in der Firefox Console das die Funktion "waitForElement" nicht definiert ist

                        Kann es sein das ich noch irgendwas installieren muss denn ich habe jQuery noch nie verwendet ?
                        Auch "Scripte" Tab belege ich zum ersten mal.

                        Oder muss ich irgendwo noch was mit "require" einbinden ?

                        Gruß aus dem rheinischen

                        liv-in-skyL 2 Antworten Letzte Antwort
                        0
                        • MoppedmanM Moppedman

                          @liv-in-sky

                          bekomme die Fehlermeldung in der Firefox Console das die Funktion "waitForElement" nicht definiert ist

                          Kann es sein das ich noch irgendwas installieren muss denn ich habe jQuery noch nie verwendet ?
                          Auch "Scripte" Tab belege ich zum ersten mal.

                          Oder muss ich irgendwo noch was mit "require" einbinden ?

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

                          @moppedman

                          nein - juery ist in vis aktiviert - auch kein require notig

                          ich halte nichts von firefox - teste dafür nicht und programmere auch dafür nicht

                          teste mal in chrome und poste mal alles, was du jetzt im scripte tab hast
                          nutze bitte die code tags des forums fürs das posten des scriptes

                          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
                          • ScroungerS Scrounger

                            @moppedman sagte in Sprung von materialdesign Table auf anderen Seite:

                            Hi @scrounger

                            danke für die schnelle Rückmeldung. Ich bin mir nicht sicher ob du ganz verstanden hast was ich will. Den Sprung über einen Link Button oder Button State kriege ich schon hin, was mir fehlt ist aber wie ich an die Daten aus der "Table" komme dessen Zeile gerade vom USER angeclickt wurde.

                            Doch hab verstanden was du machen willst. Wie gesagt kannst dir per Script das json für deine Tabelle bauen und dort ein HTML wider Button state einbauen, das dann die ID verwendet.
                            Die Losung @liv-in-sky geht natürlich auch

                            MoppedmanM Offline
                            MoppedmanM Offline
                            Moppedman
                            schrieb am zuletzt editiert von
                            #15

                            @scrounger

                            verstehe ich das dann richtig das ich die vorhandene Tabelle per JS um eine Spalte erweitere und dann in den JSON string pro Zeile ein HTML Button einbaue.

                            Wenn ich das so richtig verstanden habe, wie wir das dann mit der Perfomance des pi4 sein wenn in jede Zeile so ein Button kommt. Immerhin ziehe ich aus der DB mehrere Hundert Zeilen

                            Gruß aus dem rheinischen

                            liv-in-skyL ScroungerS 3 Antworten Letzte Antwort
                            0
                            • MoppedmanM Moppedman

                              @scrounger

                              verstehe ich das dann richtig das ich die vorhandene Tabelle per JS um eine Spalte erweitere und dann in den JSON string pro Zeile ein HTML Button einbaue.

                              Wenn ich das so richtig verstanden habe, wie wir das dann mit der Perfomance des pi4 sein wenn in jede Zeile so ein Button kommt. Immerhin ziehe ich aus der DB mehrere Hundert Zeilen

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

                              @moppedman kennst du anydesk - ich hätte eine halbe stunde - siehe chat

                              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
                              • MoppedmanM Moppedman

                                @scrounger

                                verstehe ich das dann richtig das ich die vorhandene Tabelle per JS um eine Spalte erweitere und dann in den JSON string pro Zeile ein HTML Button einbaue.

                                Wenn ich das so richtig verstanden habe, wie wir das dann mit der Perfomance des pi4 sein wenn in jede Zeile so ein Button kommt. Immerhin ziehe ich aus der DB mehrere Hundert Zeilen

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

                                @moppedman

                                nein -du baust da nichts ein - bei meinem beispiel siehst du zwar einen button , aber da testete ich was anderes

                                die lösung von scrounger wäre so eine lösung - da baust du durch dein script in die tabelle etwas ein

                                ich denke nicht, dass der pi4 ein problem hat

                                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
                                • MoppedmanM Moppedman

                                  @liv-in-sky

                                  bekomme die Fehlermeldung in der Firefox Console das die Funktion "waitForElement" nicht definiert ist

                                  Kann es sein das ich noch irgendwas installieren muss denn ich habe jQuery noch nie verwendet ?
                                  Auch "Scripte" Tab belege ich zum ersten mal.

                                  Oder muss ich irgendwo noch was mit "require" einbinden ?

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

                                  @moppedman habe es kurz in firefox ausprobiert - funktioniert dort auch

                                  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

                                  MoppedmanM 1 Antwort Letzte Antwort
                                  0
                                  • MoppedmanM Moppedman

                                    @scrounger

                                    verstehe ich das dann richtig das ich die vorhandene Tabelle per JS um eine Spalte erweitere und dann in den JSON string pro Zeile ein HTML Button einbaue.

                                    Wenn ich das so richtig verstanden habe, wie wir das dann mit der Perfomance des pi4 sein wenn in jede Zeile so ein Button kommt. Immerhin ziehe ich aus der DB mehrere Hundert Zeilen

                                    ScroungerS Offline
                                    ScroungerS Offline
                                    Scrounger
                                    Developer
                                    schrieb am zuletzt editiert von
                                    #19

                                    @moppedman

                                    Ja genau richtig verstanden.
                                    Wie das mit der Performance aussieht kann ich Dir nicht sagen. Müsste aber klappen, wenn du die Daten nicht alle paar Sekunden aktualisierst.
                                    Könntest auch um Performance zu sparen immer nur die Änderungen in den JSON string schreiben.

                                    <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

                                    <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

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

                                      @moppedman habe es kurz in firefox ausprobiert - funktioniert dort auch

                                      MoppedmanM Offline
                                      MoppedmanM Offline
                                      Moppedman
                                      schrieb am zuletzt editiert von
                                      #20

                                      @liv-in-sky

                                      Danke deiner Hilfe funktioniert das jetzt wenn ich die ID-Spalte anklicke das dann der Wert in den von mir angelegte DP geschrieben wird. Auch die Weiterverarbeitung geht nun sauber.

                                      Eins habe ich aber festgestellt funktioniert nicht wie von dir geschreiben. Wenn ich die Tabelle nach einer der Spalten sortiere geht es nicht mehr. Dann muss ich die Seite im Browser Refreshen. Das gleiche wenn ich eine Query an die DB mit veränderten Suchparametern schicke und das Ergebnis im JSON neu anzeige. Für mich sieht es so aus das die Funktion waitforElement nur beim Neuladen der Seite getriggert wird.

                                      Siehst du das auch so, und wenn ja einen Vorschlag wie ich das abstellen könnte?
                                      Anbei der aktuelle Code

                                      
                                        function waitForElement(parent, elementPath, wid, widgetName, callBack, counter = 0, debug = false) {
                                       
                                              if (counter < 30) {
                                       
                                                  setTimeout(function () {
                                       
                                                      if (parent.find(elementPath).length > 0) {
                                       
                                                          if (debug) console.log(`[${widgetName} ${wid}] it took ${counter}ms to wait for the element '${elementPath}'`);
                                       
                                                          callBack();
                                       
                                                      } else {
                                       
                                                          if (debug) console.log(`[${widgetName} ${wid}] wait for element '${elementPath}'`);
                                       
                                                          counter++
                                       
                                                          waitForElement(parent, elementPath, wid, widgetName, callBack, counter, debug);
                                       
                                                      }
                                       
                                                  }, 1000);
                                       
                                              } else {
                                       
                                                 if (debug) console.warn(`[${widgetName} ${wid}] stop waiting after ${counter} retries`);
                                       
                                                  callBack();
                                       
                                             }
                                       
                                         }
                                       
                                        
                                        
                                        
                                        
                                        waitForElement($('body'),'#w00685', 'dummy', 'dummy', function () {
                                      
                                       
                                      
                                        // Widget ist geladen, auf das Widget klicken, w02705 ist die ID von meinem basic - Screen Resolution Widget
                                      
                                       
                                      
                                       console.log("jetzt")
                                      
                                       
                                      
                                       $("[id$='col9']").click(function() {
                                      
                                           var matches = this.id; 
                                      
                                            var matches2 = $(this).text(); 
                                      
                                            alert(matches+matches2);
                                      
                                            vis.setValue('0_userdata.0.KOR-DatenPunkte.Whisky.Ralf.SelectedSearch_ID',matches2.trim()); 
                                      
                                       });  /*});*/
                                      
                                       
                                      
                                       $(".mdc-data-table_header-cell").click(function() {
                                      
                                           console.log("sort");
                                      
                                       $("[id$='col9']").click(function() {
                                      
                                           var matches = this.id; 
                                      
                                            var matches2 = $(this).text(); 
                                      
                                             alert(matches+matches2);
                                      
                                            vis.setValue('0_userdata.0.KOR-DatenPunkte.Whisky.Ralf.SelectedSearch_ID',matches2.trim());
                                      
                                       }); });
                                      
                                       
                                      
                                       /*  }, 3000);*/
                                      
                                       
                                      
                                      }, 0, true);
                                      
                                      

                                      Gruß aus dem rheinischen

                                      liv-in-skyL 1 Antwort Letzte Antwort
                                      0
                                      • MoppedmanM Moppedman

                                        @liv-in-sky

                                        Danke deiner Hilfe funktioniert das jetzt wenn ich die ID-Spalte anklicke das dann der Wert in den von mir angelegte DP geschrieben wird. Auch die Weiterverarbeitung geht nun sauber.

                                        Eins habe ich aber festgestellt funktioniert nicht wie von dir geschreiben. Wenn ich die Tabelle nach einer der Spalten sortiere geht es nicht mehr. Dann muss ich die Seite im Browser Refreshen. Das gleiche wenn ich eine Query an die DB mit veränderten Suchparametern schicke und das Ergebnis im JSON neu anzeige. Für mich sieht es so aus das die Funktion waitforElement nur beim Neuladen der Seite getriggert wird.

                                        Siehst du das auch so, und wenn ja einen Vorschlag wie ich das abstellen könnte?
                                        Anbei der aktuelle Code

                                        
                                          function waitForElement(parent, elementPath, wid, widgetName, callBack, counter = 0, debug = false) {
                                         
                                                if (counter < 30) {
                                         
                                                    setTimeout(function () {
                                         
                                                        if (parent.find(elementPath).length > 0) {
                                         
                                                            if (debug) console.log(`[${widgetName} ${wid}] it took ${counter}ms to wait for the element '${elementPath}'`);
                                         
                                                            callBack();
                                         
                                                        } else {
                                         
                                                            if (debug) console.log(`[${widgetName} ${wid}] wait for element '${elementPath}'`);
                                         
                                                            counter++
                                         
                                                            waitForElement(parent, elementPath, wid, widgetName, callBack, counter, debug);
                                         
                                                        }
                                         
                                                    }, 1000);
                                         
                                                } else {
                                         
                                                   if (debug) console.warn(`[${widgetName} ${wid}] stop waiting after ${counter} retries`);
                                         
                                                    callBack();
                                         
                                               }
                                         
                                           }
                                         
                                          
                                          
                                          
                                          
                                          waitForElement($('body'),'#w00685', 'dummy', 'dummy', function () {
                                        
                                         
                                        
                                          // Widget ist geladen, auf das Widget klicken, w02705 ist die ID von meinem basic - Screen Resolution Widget
                                        
                                         
                                        
                                         console.log("jetzt")
                                        
                                         
                                        
                                         $("[id$='col9']").click(function() {
                                        
                                             var matches = this.id; 
                                        
                                              var matches2 = $(this).text(); 
                                        
                                              alert(matches+matches2);
                                        
                                              vis.setValue('0_userdata.0.KOR-DatenPunkte.Whisky.Ralf.SelectedSearch_ID',matches2.trim()); 
                                        
                                         });  /*});*/
                                        
                                         
                                        
                                         $(".mdc-data-table_header-cell").click(function() {
                                        
                                             console.log("sort");
                                        
                                         $("[id$='col9']").click(function() {
                                        
                                             var matches = this.id; 
                                        
                                              var matches2 = $(this).text(); 
                                        
                                               alert(matches+matches2);
                                        
                                              vis.setValue('0_userdata.0.KOR-DatenPunkte.Whisky.Ralf.SelectedSearch_ID',matches2.trim());
                                        
                                         }); });
                                        
                                         
                                        
                                         /*  }, 3000);*/
                                        
                                         
                                        
                                        }, 0, true);
                                        
                                        
                                        liv-in-skyL Offline
                                        liv-in-skyL Offline
                                        liv-in-sky
                                        schrieb am zuletzt editiert von
                                        #21

                                        @moppedman sagte in Sprung von materialdesign Table auf anderen Seite:

                                        abelle nach einer der Spalten sortiere geht es nicht mehr

                                        dacht eeigentlich , ich hääte das gelöst - muss ich nochmal nachsehen

                                        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

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

                                          @moppedman sagte in Sprung von materialdesign Table auf anderen Seite:

                                          abelle nach einer der Spalten sortiere geht es nicht mehr

                                          dacht eeigentlich , ich hääte das gelöst - muss ich nochmal nachsehen

                                          MoppedmanM Offline
                                          MoppedmanM Offline
                                          Moppedman
                                          schrieb am zuletzt editiert von
                                          #22

                                          @liv-in-sky
                                          check doch mal gerade deine Code vom 2ten Post wo du gschrieben hast das es nun mit dem Sortieren geht. Wenn ich den überfliege ist das identisch mit dem vom Ersten.

                                          vllt hast du nur versehntlich den alten reinkopiert. Was müsste denn der Unterschied sein ??

                                          Gruß aus dem rheinischen

                                          liv-in-skyL 2 Antworten Letzte Antwort
                                          0
                                          Antworten
                                          • In einem neuen Thema antworten
                                          Anmelden zum Antworten
                                          • Älteste zuerst
                                          • Neuste zuerst
                                          • Meiste Stimmen


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          789

                                          Online

                                          32.4k

                                          Benutzer

                                          81.6k

                                          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