frankx: select, radio, label for, x(ht)ml

Hellihello

wenn ich ein xhtml-formular erstelle, kann ich ja schön mit dem label-element die Benennung der Variablen angeben.

  
<label for="anrede">Anrede</label>  
<select id="andrede" name="anrede">  
<option>Frau</option>  
<option>Herr</option>  
<option>Firma</option>  
</select>  

Nehme ich aber statt der Select-Box Radiobuttons, dann verliere ich den Bezug zur Varialbe "anrede", da die Labels dann ja nicht den Anzeigenamen der Variable angeben sondern den Variablenwert.

  
<label for="anredeFrau">Frau</label>  
<input type="radio" id="anredeFrau" value="Frau"/>  
<label for="anredeHerr">Herr</label>  
<input type="radio" id="anredeHerr" value="Herr"/>  
<label for="anredeFirma">Firma</label>  
<input type="radio" id="anredeFirma" value="Firma"/>  

Ich könnte jetzt noch ein Label-Element drumrumpacken und es auf "anredeFrau" beziehen, das wäre aber nicht der Sinn der Sache, da ich nämlich gerne den Anzeigenamen der Variablennamen aus dem xhtml-Formular auslesen möchte. Das Formular soll also als Model-Definition alle nötigen Infos enthalten. Mir scheint, dass dafür dann eben Radiobuttons nicht tauglich wären.

Abgesehen davon frage ich mich, ob es nicht sinnvoll wäre, die Kombination label-input/select nochmal in ein Element einzufassen, um zum einen mit PHP-Domfunktion eine günstigere Struktur zum auslesen zu haben und zum anderen, um die Formatierung (Block=Absatz für jede Einheit) leichter zu ermöglichen. Ich las mal, dass CSS3 zB für die Einheit von Überschrift und Absatz ein <section>-Element vorsieht.

Dank und Gruß,

frankx

  1. Moin!

    wenn ich ein xhtml-formular erstelle, kann ich ja schön mit dem label-element die Benennung der Variablen angeben.

    <label for="anrede">Anrede</label>
    <select id="andrede" name="anrede">
    <option>Frau</option>
    <option>Herr</option>
    <option>Firma</option>
    </select>

      
    In diesem Code ist ein Tippfelher: Entweder muß es "for=andrede" heißen, oder "id=anrede". Die Attributwerte von for (im <label>) und id (im Formularelement) müssen identisch sein.  
      
    
    > Nehme ich aber statt der Select-Box Radiobuttons, dann verliere ich den Bezug zur Varialbe "anrede", da die Labels dann ja nicht den Anzeigenamen der Variable angeben sondern den Variablenwert.  
      
    Labels beziehen sich immer nur genau auf ein Formularelement, nicht auf Gruppen von Formularelementen. Sie dienen dazu, eine (ggf. zusätzliche) Beschriftung eines Eingabeelements wie z.B. eines einzelnen Radiobuttons zu erlauben, sind aber nicht dazu da, die gesamte Radiobuttongruppe zu beschriften.  
      
    Wenn du Gruppen von Eingabeelementen gruppieren und benennen willst, nutze <fieldset>.  
      
    
    > ~~~html
      
    
    > <label for="anredeFrau">Frau</label>  
    > <input type="radio" id="anredeFrau" value="Frau"/>  
    > <label for="anredeHerr">Herr</label>  
    > <input type="radio" id="anredeHerr" value="Herr"/>  
    > <label for="anredeFirma">Firma</label>  
    > <input type="radio" id="anredeFirma" value="Firma"/>  
    > 
    
    

    Hier ist doch alles bestens - mal abgesehen von der Tatsache, dass kein name-Attribut verwendet wurde und deshalb keine Radiobuttongruppe entstanden ist, sondern drei einzelne Radiobuttons, die nichts miteinander zu tun haben.

    Ich könnte jetzt noch ein Label-Element drumrumpacken und es auf "anredeFrau" beziehen, das wäre aber nicht der Sinn der Sache, da ich nämlich gerne den Anzeigenamen der Variablennamen aus dem xhtml-Formular auslesen möchte. Das Formular soll also als Model-Definition alle nötigen Infos enthalten. Mir scheint, dass dafür dann eben Radiobuttons nicht tauglich wären.

    Ich verstehe das Problem nicht.

    Radiobuttons sind sinnvoll, wenn man genau eine Option aus mehreren auswählen können soll und diese Optionen alle sichtbar präsentieren will. Eine Alternative zu Radiobuttons wäre (von der Auswahlmöglichkeit her) eine <select>-Liste.

    - Sven Rautenberg

    --
    "Love your nation - respect the others."
    1. Hello out there!

      Labels beziehen sich immer nur genau auf ein Formularelement, nicht auf Gruppen von Formularelementen. Sie dienen dazu, eine (ggf. zusätzliche) Beschriftung eines Eingabeelements wie z.B. eines einzelnen Radiobuttons zu erlauben, sind aber nicht dazu da, die gesamte Radiobuttongruppe zu beschriften.

      Würde ja auch keinen Sinn machen, da Labels auch dazu dienen, das beim Click auf diese der Radiobutton (die Checkbox, ...) ausgewählt wird, damit man mit der Maus nicht auf ein winziges Fleckchen zielen muss (Fitts’ Law).

      Radiobuttons sind sinnvoll, wenn man genau eine Option aus mehreren auswählen können soll und diese Optionen alle sichtbar präsentieren will. Eine Alternative zu Radiobuttons wäre (von der Auswahlmöglichkeit her) eine <select>-Liste.

      Wobei es letztere auch mit Mehrfachauswahl gibt.

      See ya up the road,
      Gunnar

      --
      „Wer Gründe anhört, kommt in Gefahr nachzugeben.“ (Goethe)
      1. Hellihello Gunnar,

        Radiobuttons sind sinnvoll, wenn man genau eine Option aus mehreren auswählen können soll und diese Optionen alle sichtbar präsentieren will. Eine Alternative zu Radiobuttons wäre (von der Auswahlmöglichkeit her) eine <select>-Liste.

        Wobei es letztere auch mit Mehrfachauswahl gibt.

        Genau, was bei Radiobutton rein logisch auch Sinn machen würde, warum eine Mehrfachauswahl nicht auch als Radiobutton formatiert anbieten?

        Dank und Gruß,

        frankx

        1. Moin!

          Radiobuttons sind sinnvoll, wenn man genau eine Option aus mehreren auswählen können soll und diese Optionen alle sichtbar präsentieren will. Eine Alternative zu Radiobuttons wäre (von der Auswahlmöglichkeit her) eine <select>-Liste.

          Wobei es letztere auch mit Mehrfachauswahl gibt.

          Genau, was bei Radiobutton rein logisch auch Sinn machen würde, warum eine Mehrfachauswahl nicht auch als Radiobutton formatiert anbieten?

          Weil's dann Checkboxen sein müßten.

          - Sven Rautenberg

          --
          "Love your nation - respect the others."
          1. Hellihello

            Moin!

            Radiobuttons sind sinnvoll, wenn man genau eine Option aus mehreren auswählen können soll und diese Optionen alle sichtbar präsentieren will. Eine Alternative zu Radiobuttons wäre (von der Auswahlmöglichkeit her) eine <select>-Liste.

            Wobei es letztere auch mit Mehrfachauswahl gibt.

            Genau, was bei Radiobutton rein logisch auch Sinn machen würde, warum eine Mehrfachauswahl nicht auch als Radiobutton formatiert anbieten?

            Weil's dann Checkboxen sein müßten.

            Aber die sind eckig.

            • Sven Rautenberg

            Dank und Gruß,

            frankx

              
            <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  
            "http://www.w3.org/TR/html4/loose.dtd">  
            <html>  
             <head>  
              <title><?php echo basename(__FILE__)?></title>  
              
             </head>  
             <body>  
              <form method="get" action="">  
              <fieldset>  
              <legend>checkboxen</legend>  
              <input type="checkbox" name="checkbox[]" value="checkbox1">  
              <input type="checkbox" name="checkbox[]" value="checkbox2">  
              <input type="checkbox" name="checkbox[]" value="checkbox3">  
              <input type="checkbox" name="checkbox[]" value="checkbox4">  
              </fieldset>  
              <fieldset>  
              <legend>selectbox</legend>  
              <select name="select[]" multiple="multiple" size="5">  
              <option>option1</option>  
              <option>option2</option>  
              <option>option3</option>  
              <option>option4</option>  
              <option>option5</option>  
              </select>  
              <input type="submit">  
              </fieldset>  
              <pre><?php  
              var_dump($_REQUEST);?>  
              </pre>  
             </body>  
            </html>  
            
            
            1. Hello out there!

              warum eine Mehrfachauswahl nicht auch als Radiobutton formatiert anbieten?

              Weil's dann Checkboxen sein müßten.

              Aber die sind eckig.

              Eben. Damit man sie von Radiobuttons unterscheiden kann.

              Es macht doch für Nutzer Sinn, optisch erkennen zu können, ob Mehrfachauswahl möglich ist oder nicht. Rund - Radiobuttons - keine Mehrfachauswahl / eckig - Checkboxen - Mehrfachauswahl sind Nutzer gewohnt - schon seit Zeiten von reinen Textfenstern:

              (.) foo  ( ) bar  ( ) baz

              [x] foo  [x] bar  [ ] baz

              See ya up the road,
              Gunnar

              --
              „Wer Gründe anhört, kommt in Gefahr nachzugeben.“ (Goethe)
            2. Moin!

              Genau, was bei Radiobutton rein logisch auch Sinn machen würde, warum eine Mehrfachauswahl nicht auch als Radiobutton formatiert anbieten?

              Weil's dann Checkboxen sein müßten.

              Aber die sind eckig.

              Es geht nicht nach der Form, sondern nach der Funktion. <select> mit Mehrfachauswahl erlaubt 0..n ausgewählte Optionen in einer Liste von n Elementen. Genauso wie bei einer Gruppe von Checkboxen.

              Das Problem ist nur, dass der Benutzer keinen optischen Indikator hat, dass seine Liste auf einmal Mehrfachauswahl erlaubt. Und der Versuch, textliche Hilfestellung zu geben, scheitern an der Unterschiedlichkeit der benutzten Betriebssysteme. Nicht auf allen Computern gibt es z.B. eine Taste "Strg" - entweder, weil die Tastatur englisch ist und die Taste "Ctrl" heißt, oder weil's ein Mac ist, oder weil gar nicht "Strg" gedrückt werden muß, um Mehrfachauswahlklicks vorzunehmen...

              Deshalb ist von Mehrfachauswahlboxen nach Möglichkeit immer abzuraten. Zumal deren Usability insbesondere bei längeren Listen doch arg zu wünschen übrig läßt. Viel zu leicht passiert es, dass man am einen Ende der Liste eine Auswahl tätigt, dann den gewählten Eintrag aus dem sichtbaren Bereich herausscrollt und am anderen Ende ebenfalls nochmal klickt. "Hat der Computer den Eintrag jetzt akzeptiert und beide Optionen gewählt, oder nur einen?" ist in solchen Situationen die häufigste Frage - mit einer längeren (und daher scrollbaren) Checkbox-Seite würden solche Fragen nie auftreten.

              PS: Warum gibts in deinem Testcode keine Label mehr?

              - Sven Rautenberg

              --
              "Love your nation - respect the others."
              1. Hellihello Sven,

                Es geht nicht nach der Form, sondern nach der Funktion. <select> mit Mehrfachauswahl erlaubt 0..n ausgewählte Optionen in einer Liste von n Elementen. Genauso wie bei einer Gruppe von Checkboxen.

                Gunnar schrub ja schon, dass das seit Urzeiten eine Konvention ist. Bei Radiobuttons ist ja wohl auch die Bedingung, dass ein Feld angeklickt sein muss, oder? Zumindest kriegste sie ja nicht mehr weg wie bei Checkboxen.

                Der Rest leuchtet ja optimal ein. Der Kniff ist halt, ein   [] an den Varnamen zu hängen.

                Bin ich ja an andrerer Stelle als erwartet noch schlauer geworden (;-).

                Dank und Gruß,

                frankx

                1. Hello out there!

                  Gunnar schrub ja schon

                  Was unterstellst du mit getan zu haben? ;-)

                  Bei Radiobuttons ist ja wohl auch die Bedingung, dass ein Feld angeklickt sein muss, oder?

                  Siehe Radio-Buttons [HTML401 §17.2.1]

                  See ya up the road,
                  Gunnar

                  --
                  „Wer Gründe anhört, kommt in Gefahr nachzugeben.“ (Goethe)
    2. Hellihello Sven,

      Hier ist doch alles bestens - mal abgesehen von der Tatsache, dass kein name-Attribut verwendet wurde und deshalb keine Radiobuttongruppe entstanden ist, sondern drei einzelne Radiobuttons, die nichts miteinander zu tun haben.

      Ich könnte jetzt noch ein Label-Element drumrumpacken und es auf "anredeFrau" beziehen, das wäre aber nicht der Sinn der Sache, da ich nämlich gerne den Anzeigenamen der Variablennamen aus dem xhtml-Formular auslesen möchte. Das Formular soll also als Model-Definition alle nötigen Infos enthalten. Mir scheint, dass dafür dann eben Radiobuttons nicht tauglich wären.

      Ich verstehe das Problem nicht.

      Mh, also die Überlegung wäre, nicht eine PHP-Klasse zu bauen, sondern nur ein Formular in X(HT)ML, aus dem sich dann die Klasse generiert. Der Anzeigename einer Variablen ist dann eben der Inhalt von dem Element <label>. Das lässt sich mit simpleXML ja ganz gut auslesen. Ebenso für Änderungen oder die Anzeige (Formular nur readonly) könnte dann das Attribut value bestückt werden. Im Grunde ist meine Frage mittlerweile beantwortet. Select-Boxen sind erstmal das Mittel der Wahl. Sie unterscheiden sich ja logisch, als Auswahl aus einer Liste von Presets, von den Radiobuttons nicht. Nur eben in der Anzeige. (Eigentlich sollte man die Radios per CSS formatieren können aus einer Select-Option-Liste(;-)).

      Radiobuttons sind sinnvoll, wenn man genau eine Option aus mehreren auswählen können soll und diese Optionen alle sichtbar präsentieren will. Eine Alternative zu Radiobuttons wäre (von der Auswahlmöglichkeit her) eine <select>-Liste.

      • Sven Rautenberg

      Dank und Gruß,

      frankx