Skip to content
  • Home
  • Recent
  • Tags
  • 0 Unread 0
  • Categories
  • Unreplied
  • Popular
  • 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

  • Default (No Skin)
  • No Skin
Collapse
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. Material Design Widgets: Input, Select, Autocompl.

NEWS

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    22
    1
    1.1k

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

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    14
    1
    2.4k

Material Design Widgets: Input, Select, Autocompl.

Scheduled Pinned Locked Moved Visualisierung
vis
147 Posts 38 Posters 23.7k Views 29 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • NamrennerN Namrenner

    Hallo,

    1. wie bekomme ich den Abstand oben und unten weg, möchte selbe größe wie links haben?
    2. Menü Auswahl Abstand links weg?
      Danke

    Unbenannt.jpg

    NamrennerN Offline
    NamrennerN Offline
    Namrenner
    wrote on last edited by
    #138

    @namrenner keiner hat eine Idee?

    1 Reply Last reply
    0
    • Q Offline
      Q Offline
      Qlink
      wrote on last edited by Qlink
      #139

      Hi Leute,

      bei mir wird der "Input Select Pfeil" doppelt angezeigt und ich habe keine Idee woher das kommt.
      Kann mir jemand sagen wie ich den kleinen "nicht ausgefüllten" Pfeil im Hintergrund loswerde ?

      5834128f-792c-4aad-a40c-a9570a3744e0-image.png

      Die kleinen Pfeile werden übrigens nur sichtbar wenn man die "font-size" auf xx-large stellt.
      Bleibt die "font-size" auf normal, dann rutschen die kleinen Pfeile hinter die großen und sind unsichtbar.

      Beste Grüße

      1 Reply Last reply
      0
      • M Offline
        M Offline
        Marc9025
        wrote on last edited by
        #140

        Hallo zusammen,
        ist es möglich wenn man beim Input Widget Datum ausgewählt hat, dass er beim neu laden der Seite das aktuelle Datum Anzeigt und nicht was vorher darin stand?

        1 Reply Last reply
        0
        • M Offline
          M Offline
          MaikB85
          wrote on last edited by
          #141

          Kann mir jemand erklären, wie das mit "Eingabetyp - Zeit" funktioniert. Wenn ich da eine Zeit eingebe, werden nur die Stunden als Wert eingetragen und das Input-Feld springt wieder zurück auf 12:30 (graue Schrift). Was soll das für ein Datentyp sein?

          M 1 Reply Last reply
          0
          • M MaikB85

            Kann mir jemand erklären, wie das mit "Eingabetyp - Zeit" funktioniert. Wenn ich da eine Zeit eingebe, werden nur die Stunden als Wert eingetragen und das Input-Feld springt wieder zurück auf 12:30 (graue Schrift). Was soll das für ein Datentyp sein?

            M Offline
            M Offline
            MaikB85
            wrote on last edited by
            #142

            @maikb85 Datentyp ist String. Steht auch in der Doku :face_palm: :grin:
            Naja dann muss ich das irgendwie wieder zu Integerwerte parsen...

            1 Reply Last reply
            0
            • M Offline
              M Offline
              Martin1982
              wrote on last edited by
              #143

              Hallo,

              ich wollte eine sehr einfache PostIt Notiz Funktion in meine VIS einbauen.

              Eingabe übers Handy ==> String Datenpunt ==> Anzeige auf dem Tablet an der Wand.

              Das klappt eigentlich auch ganz gut und einfach. Aber ich habe keine Möglichkeit gefunden MultiLine Text in der VIS einzugeben. Am liebsten würde ich das Material Design Text Input verwenden. Da habe ich aber leider kein entsprechendes Property gefunden. Aber anscheid kann es auch kein anderes Control. Gibt es hier eventuell eine Möglichkeit und ich habe sie nur übersehen? Oder gibt es einen Grund warum das Text Input diese eigentlich grundlegende Funktion nicht hat?

              Gruß
              Martin

              liv-in-skyL 1 Reply Last reply
              0
              • M Martin1982

                Hallo,

                ich wollte eine sehr einfache PostIt Notiz Funktion in meine VIS einbauen.

                Eingabe übers Handy ==> String Datenpunt ==> Anzeige auf dem Tablet an der Wand.

                Das klappt eigentlich auch ganz gut und einfach. Aber ich habe keine Möglichkeit gefunden MultiLine Text in der VIS einzugeben. Am liebsten würde ich das Material Design Text Input verwenden. Da habe ich aber leider kein entsprechendes Property gefunden. Aber anscheid kann es auch kein anderes Control. Gibt es hier eventuell eine Möglichkeit und ich habe sie nur übersehen? Oder gibt es einen Grund warum das Text Input diese eigentlich grundlegende Funktion nicht hat?

                Gruß
                Martin

                liv-in-skyL Offline
                liv-in-skyL Offline
                liv-in-sky
                wrote on last edited by
                #144

                @martin1982

                kann dir nur ein beispiel meiner tests bieten - nutze jedoch nicht das materiald-widget :

                script-vis27.gif

                [{"tpl":"tplHtml","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":true,"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 style=\"white-space: pre\">\n{0_userdata.0.CONTROL-OWN.AAATEST.TestString2}\n</div>"},"style":{"left":"950px","top":"919px","color":"#43e01a","font-weight":"bold","font-family":"Ubuntu-BoldItalic"},"widgetSet":"basic"},{"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":"    <form onsubmit=\"return false\">\n    <textarea id=\"myTextarea\" name=\"message\" rows=\"4\" cols=\"30\"></textarea>\n    <input type=\"submit\" value=\"Submit\" onclick=\"test1()\">\n    </form>\n    \n  \n       \n       <script>\n           function test1(){\n               console.log(document.getElementById(\"myTextarea\").value);\n               vis.setValue('0_userdata.0.CONTROL-OWN.AAATEST.TestString2',document.getElementById(\"myTextarea\").value);\n           }\n       </script>"},"style":{"left":"962px","top":"792px"},"widgetSet":"basic"}]
                

                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

                M 1 Reply Last reply
                1
                • liv-in-skyL liv-in-sky

                  @martin1982

                  kann dir nur ein beispiel meiner tests bieten - nutze jedoch nicht das materiald-widget :

                  script-vis27.gif

                  [{"tpl":"tplHtml","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":true,"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 style=\"white-space: pre\">\n{0_userdata.0.CONTROL-OWN.AAATEST.TestString2}\n</div>"},"style":{"left":"950px","top":"919px","color":"#43e01a","font-weight":"bold","font-family":"Ubuntu-BoldItalic"},"widgetSet":"basic"},{"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":"    <form onsubmit=\"return false\">\n    <textarea id=\"myTextarea\" name=\"message\" rows=\"4\" cols=\"30\"></textarea>\n    <input type=\"submit\" value=\"Submit\" onclick=\"test1()\">\n    </form>\n    \n  \n       \n       <script>\n           function test1(){\n               console.log(document.getElementById(\"myTextarea\").value);\n               vis.setValue('0_userdata.0.CONTROL-OWN.AAATEST.TestString2',document.getElementById(\"myTextarea\").value);\n           }\n       </script>"},"style":{"left":"962px","top":"792px"},"widgetSet":"basic"}]
                  

                  M Offline
                  M Offline
                  Martin1982
                  wrote on last edited by
                  #145

                  @liv-in-sky Danke. Das ist natürlich auch ein Weg auch wenn er etwas umständlicher ist als ein Eingabe Widget direkt zu verwenden. Für den Zweck wie ich es verwenden möchte, sollte es reichen.

                  1 Reply Last reply
                  0
                  • M Offline
                    M Offline
                    michihorn
                    wrote on last edited by
                    #146

                    Hallo ich versuche Material-Dsign Input eine Zeit einzugeben. Auf meinem Tablet kommt der Dialog der Zeiteingabe, ich verstehe, dass mit dem Button Festlegen der Wert an den DP übergeben wird. Leider wird der DP nicht übergeben. Wo ist mein Fehler?

                    1 Reply Last reply
                    0
                    • B Offline
                      B Offline
                      BamBam89
                      wrote on last edited by
                      #147

                      Hallo zusammen,

                      evtl. bin ich ja zu blind. Ich möchte gerne Autocomplete mit einem JSON Datenpunkt aus dem IOBroker bedienen.
                      Über den Editor klappt das, aber funktioniert das Binding aus IOBroker heraus.

                      Lt. Anleitung müsste es ja gehen.
                      Zitat:

                      Here you can add a JSON string to define the menu entries or use bindings to a datapoint that contains a JSON
                      string.

                      Könnt ihr mir da ein wenig auf die Sprünge helfen?

                      Vielen Dank und schöne Ostern.

                      1 Reply Last reply
                      0
                      Reply
                      • Reply as topic
                      Log in to reply
                      • Oldest to Newest
                      • Newest to Oldest
                      • Most Votes


                      Support us

                      ioBroker
                      Community Adapters
                      Donate

                      403

                      Online

                      32.5k

                      Users

                      81.7k

                      Topics

                      1.3m

                      Posts
                      Community
                      Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                      ioBroker Community 2014-2025
                      logo
                      • Login

                      • Don't have an account? Register

                      • Login or register to search.
                      • First post
                        Last post
                      0
                      • Home
                      • Recent
                      • Tags
                      • Unread 0
                      • Categories
                      • Unreplied
                      • Popular
                      • GitHub
                      • Docu
                      • Hilfe