Mehrere Optionsfeldgruppen in einem Formular


113

Ist es möglich, mehrere Optionsfeldgruppen in einem einzigen Formular zu haben? Wenn Sie normalerweise eine Schaltfläche auswählen, wird die vorherige deaktiviert. Ich muss nur eine Gruppe deaktivieren.

<form>
    <fieldset id="group1">
        <input type="radio" value="">
        <input type="radio" value="">
    </fieldset>

    <fieldset id="group2">
        <input type="radio" value="">
        <input type="radio" value="">
        <input type="radio" value="">
    </fieldset>
</form>

16
Geben Sie ihnen Namen (dh<input type="checkbox" name="checkGroup1" value =""/>
Paul

Antworten:


193

Legen Sie gleiche nameAttribute fest, um eine Gruppe zu erstellen.

<form>
  <fieldset id="group1">
    <input type="radio" value="value1" name="group1">
    <input type="radio" value="value2" name="group1">
  </fieldset>

  <fieldset id="group2">
    <input type="radio" value="value1" name="group2">
    <input type="radio" value="value2" name="group2">
    <input type="radio" value="value3" name="group2">
  </fieldset>
</form>


1
Wenn der Wert jedes Mal gleich "" ist, woher weiß ich, welches Optionsfeld ausgewählt wurde? Woher weiß ich, ob überhaupt ein Optionsfeld ausgewählt wurde?
user3182532

23
Geben Sie Ihre eigenen Werte ein
pankijs

12

Tun Sie nur eines: Wir müssen die Eigenschaft name für dieselben Typen festlegen. für zB.

Versuchen Sie es unten:

<form>
    <div id="group1">
        <input type="radio" value="val1" name="group1">
        <input type="radio" value="val2" name="group1">
    </div>
</form>

Und wir können es auch in Angular1, Angular 2 oder in JQuery tun.

<div *ngFor="let option of question.options; index as j">
<input type="radio" name="option{{j}}" value="option{{j}}" (click)="checkAnswer(j+1)">{{option}}
</div>  

8

Dies ist sehr einfach. Sie müssen unterschiedliche Namen für jede Funkeingangsgruppe beibehalten.

      <input type="radio" name="price">Thousand<br>
      <input type="radio" name="price">Lakh<br>
      <input type="radio" name="price">Crore
      
      </br><hr>

      <input type="radio" name="gender">Male<br>
      <input type="radio" name="gender">Female<br>
      <input type="radio" name="gender">Other


2

Um eine Gruppe von Eingaben zu erstellen, können Sie ein benutzerdefiniertes HTML-Element erstellen

window.customElements.define('radio-group', RadioGroup);

https://gist.github.com/robdodson/85deb2f821f9beb2ed1ce049f6a6ed47

Um die ausgewählte Option in jeder Gruppe beizubehalten, müssen Sie den Eingaben in der Gruppe ein Namensattribut hinzufügen. Wenn Sie es nicht hinzufügen, ist alles eine Gruppe.


2
Können Sie angeben, wie das Problem der Frage behoben wird? Dadurch wird auch nur eine Gruppe erstellt. Fügt es den Eingaben jeder Gruppe, die Sie auf diese Weise erstellen, einen eindeutigen Namen hinzu?
Marthyn Olthof

2

Geben Sie im Eingabefeld den gleichen Namen ein

<input type="radio" name="option" value="option1">
<input type="radio" name="option" value="option2" >
<input type="radio" name="option" value="option3" >
<input type="radio" name="option" value="option3" >
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.