我在表单中提供了无线电输入,供用户选择性别。如何使性别成为必需的输入(用户必须选择女性或男性,否则他们会按照通常的方式得到提示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>
Update 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>
Update 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>
只需设置required
单选组的一个输入的属性,
See the fiddle http://jsfiddle.net/lalu050/2du3s/367/
For eg:
<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>
Update
我刚刚注意到你在代码中编写的内容运行得很好......请参阅fiddle http://jsfiddle.net/lalu050/6s6wa1rk/..
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)