Question

我在表单中有无线电输入，供用户选择性别。如何使性别成为必需的输入（用户必须选择女性或男性，或者按照通常的required获得提示。）

我尝试添加required，如下所示，但它不起作用（用户无需选择女性或男性就可以继续）。

              <div class="form-group btn-group" data-toggle="buttons">
                <label class="btn btn-default btn-lg">
                  <input type="radio" name="gender" value="Female" required><i class="fa fa-female"></i> Female
                </label>
                <label class="btn btn-default btn-lg">
                  <input type="radio" name="gender" value="Male" required><i class="fa fa-male"></i> Male
                </label>
              </div>

更新1

正如答案中所建议的，我更新了代码，以便只有一个无线电输入包含required，但它仍然不起作用。

              <div class="form-group btn-group" data-toggle="buttons">
                <label class="btn btn-default btn-lg">
                  <input type="radio" name="gender" value="Female" required><i class="fa fa-female"></i> Female
                </label>
                <label class="btn btn-default btn-lg">
                  <input type="radio" name="gender" value="Male"><i class="fa fa-male"></i> Male
                </label>
              </div>

更新2

根据要求，这里是完整的代码：

          <form action="/client/index.php" method="post" role="form">
            <fieldset>
              <div class="form-group">
                <input class="form-control input-lg" placeholder="Nickname" name="nickname" type="text" autofocus required>
              </div>
              <div class="form-group btn-group" data-toggle="buttons">
                <label class="btn btn-default btn-lg">
                  <input type="radio" name="gender" value="Female" required><i class="fa fa-female"></i> Female
                </label>
                <label class="btn btn-default btn-lg">
                  <input type="radio" name="gender" value="Male"><i class="fa fa-male"></i> Male
                </label>
              </div>
              <h4>Options</h4>
              <div class="form-group">
                <div class="row">
                  <div class="col-md-6">
                    Block private chats
                  </div>
                  <div class="col-md-6">
                    <input type="checkbox" name="block" data-on-text="Yes" data-off-text="No">
                  </div>
                </div>
              </div>
              <button type="submit" name="submit" class="btn btn-lg btn-primary btn-block">Start</button>
            </fieldset>
          </form>

Answer 1

只需为radiogroup的一个输入设置required属性，

请参阅fiddle

例如：

<form>
<label for="input1">1:</label><input type="radio" name="test" id="input1" required value="1" /><br />
<label for="input2">2:</label><input type="radio" name="test" id="input2" value="2" /><br />
<label for="input3">3:</label><input type="radio" name="test" id="input3" value="3" /><br />
<input type="submit" value="send" />
</form>

<强>更新

我刚才注意到你在代码中写的内容非常完美。参见fiddle ..

Answer 2

为此，请使用required attribute

必需属性是布尔属性。

如果存在，则指定在提交表单之前必须填写输入字段。

注意：必需属性适用于以下输入类型：文本，搜索，网址，电话，电子邮件，密码，日期选择器，号码，复选框，广播和文件。

来源：http://www.w3schools.com/tags/att_input_required.asp

Example Demo

<强>更新 Test your code in fiddle

如何进行无线电输入？

更新1

更新2

2 个答案:

请参阅fiddle