tag:forum.selfhtml.org,2005:/self Inputs gruppieren – SELFHTML-Forum 2013-05-23T08:47:03Z https://forum.selfhtml.org/self/2013/may/22/inputs-gruppieren/1580330#m1580330 lollollol 2013-05-22T14:56:39Z 2013-05-22T14:56:39Z Inputs gruppieren <p>Moin,<br> folgendes Problem: Ich hab ne Form mit inputs. Damit kann ich ja super auf die Elemente zugreifen (form.inputName.value). Nun will ich aber ein paar Elemente mit Javascript löschen, aber nicht alle, weshalb form.innerHTML = ""; nicht in Frage kommt. Kann ich das irgendwie so machen, dass ich die inputs in ein Bereich packe, mit dem ich so drauf zugreifen kann: formName.bereichname.inputName....? Wenn ja, mit welchem Element muss ich das machen? Div wäre ja naheliegend, aber soweit ich weiß, kann man dem kein Name geben, oder?</p> <p>Hoffe, ihr versteht mein Problem,</p> <p>Thx<br> lollollol</p> https://forum.selfhtml.org/self/2013/may/22/inputs-gruppieren/1580337#m1580337 Gunnar Bittersmann selfhtml@bittersmann.de http://bittersmann.de/ 2013-05-22T15:18:50Z 2013-05-22T15:18:50Z Inputs gruppieren <p>@@lollollol:</p> <p>nuqneH</p> <blockquote> <p>Div wäre ja naheliegend,</p> </blockquote> <p>Mir läge fieldset näher.</p> <blockquote> <p>aber soweit ich weiß, kann man dem kein Name geben, oder?</p> </blockquote> <p>Aber IDs.</p> <p>Qapla'</p> <div class="signature">-- <br> „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer) </div> https://forum.selfhtml.org/self/2013/may/22/inputs-gruppieren/1580331#m1580331 Der Martin self@kennst.net 2013-05-22T15:23:53Z 2013-05-22T15:23:53Z Inputs gruppieren <p>Hallo,</p> <blockquote> <p>folgendes Problem: Ich hab ne Form mit inputs.</p> </blockquote> <p>ne Form? Du meinst ein Formular?</p> <blockquote> <p>Damit kann ich ja super auf die Elemente zugreifen (form.inputName.value).</p> </blockquote> <p>Das ist eine der gängigen Möglichkeiten.</p> <blockquote> <p>Nun will ich aber ein paar Elemente mit Javascript löschen, aber nicht alle, weshalb form.innerHTML = ""; nicht in Frage kommt.</p> </blockquote> <p>Außerdem wären dann nicht nur die inputs weg, sondern auch alle Labels und strukturierenden Elemente.</p> <blockquote> <p>Kann ich das irgendwie so machen, dass ich die inputs in ein Bereich packe, mit dem ich so drauf zugreifen kann: formName.bereichname.inputName....?</p> </blockquote> <p>So nicht ganz, denn inerhalb des Formulars lassen sich nur die Form Controls, also die Formularelemente so ansprechen. Du kannst aber problemlos die Elemente, die du verschwinden lassen willst, in ein gruppierendes Element stecken, diesem eine ID geben und es dann mit document.getElementById() adressieren.</p> <blockquote> <p>Wenn ja, mit welchem Element muss ich das machen? Div wäre ja naheliegend, aber soweit ich weiß, kann man dem kein Name geben, oder?</p> </blockquote> <p>Ein div wäre eine Möglichkeit (stimmt, div darf kein name-Attribut haben, aber eine ID). Innerhalb eines Formulars ist aber vermutlich fieldset das passendere Element.</p> <p>Nebenbei gefragt: Warum möchtest du die Elemente löschen? Reicht es nicht, wenn du sie (oder ihr gruppierendes Containerelement) per CSS mit display:none; ausblendest? In diesem Fall würde es genügen, dem Containerelement oder eventuell auch dem Formular selbst mit Javascript dynamisch eine Klasse zu geben (oder wegzunehmen) und mit CSS auf diese Veränderung zu reagieren.</p> <p>Ciao,<br>  Martin</p> <div class="signature">-- <br> Alle Tage sind gleich lang. Aber unterschiedlich breit.<br> Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:( </div> https://forum.selfhtml.org/self/2013/may/22/inputs-gruppieren/1580332#m1580332 lollollol 2013-05-22T18:34:54Z 2013-05-22T18:34:54Z Inputs gruppieren <blockquote> <p>ne Form? Du meinst ein Formular?</p> </blockquote> <p>jo^^</p> <blockquote> <p>Außerdem wären dann nicht nur die inputs weg, sondern auch alle Labels und strukturierenden Elemente.</p> </blockquote> <p>Hab eh keine Labels, sondern nur inputs, von daher wär das mir auch egal, hätte ich halt als letzen Ausweg gemacht.</p> <blockquote> <p>So nicht ganz, denn inerhalb des Formulars lassen sich nur die Form Controls, also die Formularelemente so ansprechen. Du kannst aber problemlos die Elemente, die du verschwinden lassen willst, in ein gruppierendes Element stecken, diesem eine ID geben und es dann mit document.getElementById() adressieren.</p> </blockquote> <p>Find halt die Methode ohne document.getElementById chilliger, weil die in dem Fall sinnvoller ist, da ich inputs mit gleichem Namen hab.</p> <blockquote> <blockquote> <p>Wenn ja, mit welchem Element muss ich das machen? Div wäre ja naheliegend, aber soweit ich weiß, kann man dem kein Name geben, oder?</p> </blockquote> <p>Ein div wäre eine Möglichkeit (stimmt, div darf kein name-Attribut haben, aber eine ID). Innerhalb eines Formulars ist aber vermutlich fieldset das passendere Element.</p> <p>Nebenbei gefragt: Warum möchtest du die Elemente löschen? Reicht es nicht, wenn du sie (oder ihr gruppierendes Containerelement) per CSS mit display:none; ausblendest? In diesem Fall würde es genügen, dem Containerelement oder eventuell auch dem Formular selbst mit Javascript dynamisch eine Klasse zu geben (oder wegzunehmen) und mit CSS auf diese Veränderung zu reagieren.</p> </blockquote> <p>Ne, das sollte schon ganz weg sein, da das alles dynamisch ist und die Spaltenanzahl nicht feststehlt. Aber danke, fieldset ist genau das, was ich brauche (y) Es funktioniert :)</p> <p>lg<br> lollollol</p> https://forum.selfhtml.org/self/2013/may/22/inputs-gruppieren/1580333#m1580333 Gunnar Bittersmann selfhtml@bittersmann.de http://bittersmann.de/ 2013-05-23T07:30:10Z 2013-05-23T07:30:10Z Inputs gruppieren <p>@@lollollol:</p> <p>nuqneH</p> <blockquote> <p>Hab eh keine Labels, sondern nur inputs</p> </blockquote> <p>Und wie weiß der Nutzer dann, was er in welches Feld eingeben soll?</p> <blockquote> <p>Find halt die Methode ohne document.getElementById chilliger, weil die in dem Fall sinnvoller ist, da ich inputs mit gleichem Namen hab.</p> </blockquote> <p>Elemente mit ID lassen sich auch document.<id> ansprechen – das ist ein Feature! ;-) (in alten IEs – nicht standardkonform, nicht verwenden!)</p> <blockquote> <p>Ne, das sollte schon ganz weg sein, da das alles dynamisch ist</p> </blockquote> <p>Ja und? Dynamisch ist auch visuell weg.* Und das ist performanter als DOM-Manipulationen.</p> <p>Qapla'</p> <p>* und wenn man’s richtig mach auch screenreader-weg.</p> <div class="signature">-- <br> „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer) </div> https://forum.selfhtml.org/self/2013/may/22/inputs-gruppieren/1580334#m1580334 1UnitedPower http://bricklandblog.blogspot.de/ 2013-05-23T08:07:40Z 2013-05-23T08:07:40Z Inputs gruppieren <blockquote> <blockquote> <p>Hab eh keine Labels, sondern nur inputs</p> </blockquote> <p>Und wie weiß der Nutzer dann, was er in welches Feld eingeben soll?</p> </blockquote> <p><a href="http://caniuse.com/#feat=input-placeholder" rel="noopener noreferrer">placeholder</a>-<a href="http://www.w3.org/TR/html51/forms.html#the-placeholder-attribute" rel="nofollow noopener noreferrer">Attribut</a> zum Beispiel.</p> https://forum.selfhtml.org/self/2013/may/22/inputs-gruppieren/1580335#m1580335 Gunnar Bittersmann selfhtml@bittersmann.de http://bittersmann.de/ 2013-05-23T08:27:48Z 2013-05-23T08:27:48Z Inputs gruppieren <p>@@1UnitedPower:</p> <p>nuqneH</p> <blockquote> <p><a href="http://caniuse.com/#feat=input-placeholder" rel="noopener noreferrer">placeholder</a>-<a href="http://www.w3.org/TR/html51/forms.html#the-placeholder-attribute" rel="nofollow noopener noreferrer">Attribut</a> zum Beispiel.</p> </blockquote> <p>Schlechstes Beispiel. Steht sogar an der von dir verlinkten Stelle: „The placeholder attribute should not be used as an alternative to a label.“</p> <p>Label in Eingabefeldern sind Designfehler. <a href="http://laurakalbag.com/labels-in-input-fields-arent-such-a-good-idea/" rel="nofollow noopener noreferrer">Keine gute Idee.</a> <a href="http://mentalized.net/journal/2010/08/05/dont_use_placeholder_text_as_labels/" rel="nofollow noopener noreferrer">Nicht machen.</a> <a href="http://www.456bereastreet.com/archive/201204/the_html5_placeholder_attribute_is_not_a_substitute_for_the_label_element/" rel="nofollow noopener noreferrer">Wirklich nicht.</a></p> <p>Es besteht ja auch überhaupt keine Notwendigkeit: Auf Desktop-Geräten ist sowieso genügend Platz für Labels da. Auf kleinen Mobilgeräten mit Tochbedienung muss man auch einigen Abstand zwischen Eingabefeldern lassen, also auch Platz für Labels da.</p> <p>Qapla'</p> <p>PS: Ich sollte meinen <a href="http://bittersmann.de/articles/label-inside/" rel="nofollow noopener noreferrer">Artikel</a> wegen dessen Unsinnigkeit mal überarbeiten.</p> <div class="signature">-- <br> „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer) </div> https://forum.selfhtml.org/self/2013/may/22/inputs-gruppieren/1580336#m1580336 1UnitedPower http://bricklandblog.blogspot.de/ 2013-05-23T08:47:03Z 2013-05-23T08:47:03Z Inputs gruppieren <blockquote> <p>Label in Eingabefeldern sind Designfehler. <a href="http://laurakalbag.com/labels-in-input-fields-arent-such-a-good-idea/" rel="nofollow noopener noreferrer">Keine gute Idee.</a> <a href="http://mentalized.net/journal/2010/08/05/dont_use_placeholder_text_as_labels/" rel="nofollow noopener noreferrer">Nicht machen.</a> <a href="http://www.456bereastreet.com/archive/201204/the_html5_placeholder_attribute_is_not_a_substitute_for_the_label_element/" rel="nofollow noopener noreferrer">Wirklich nicht.</a></p> </blockquote> <p>Die Argumentation ist schlüssig. Eine Fallstudie zu dem Thema wäre sicher interessant.</p>