英文:
radio box input stores "on" as database value
问题
单选框输入不会存储值,而是在数据库中显示 "on"。以下是我的代码:
<label for="gender">Female</label>
<input type="radio" name="gender">
<label for="gender">Male</label>
<input type="radio" name="gender">
<label for="gender">Transgender</label>
<input type="radio" name="gender">
<span class="formerror"></span>
这是我的模式:
gender: {
type: String,
required: true
}
这是数据库中存储的数据:
{
name: 'Ethan Hunt',
age: 60,
gender: 'on',
blood_group: 'B+',
date: 2023-07-05T00:00:00.000Z,
phone_number: '7074788341',
medical_history: 'cataract',
password: '1234',
_id: new ObjectId("64a1bced4796f50508c67030"),
__v: 0
}
我期望性别值显示为 "male"、"female" 或 "transgender"。
我还尝试添加以下内容:
gender: {
type: String,
enum: ["female", "male", "transgender"],
required: true
}
但它生成了错误消息:"详细验证失败:gender:'on' 不是路径 'gender' 的有效枚举值。在 ValidationError 中"。
英文:
radio box input doesn't store the value instead shows "on" in the database
here is my code.
<label for="gender">Female</label>
<input type="radio" name="gender">
<label for="gender">Male</label>
<input type="radio" name="gender">
<label for="gender">Transgender</label>
<input type="radio" name="gender">
<span class="formerror"></span>
this is my schema
gender: {
type: String,
required: true
}
this is the data in the database stored
{
name: 'Ethan Hunt',
age: 60,
gender: 'on',
blood_group: 'B+',
date: 2023-07-05T00:00:00.000Z,
phone_number: '7074788341',
medical_history: 'cataract',
password: '1234',
_id: new ObjectId("64a1bced4796f50508c67030"),
__v: 0
}
i was expecting the gender value to show up as "male" "female" or "transgender".
i also tried adding
gender: {
type: String,
enum: ["female", "male", "transgender"],
required: true
},
but it generates an error
"Detail validation failed: gender: on
is not a valid enum value for path gender
.
at ValidationError"
答案1
得分: 1
为您的HTML元素添加一个 "value" 属性,并将其值设置为表示性别的值。
还可以阅读:https://developer.mozilla.org/en-US/docs/Web/API/Element/getAttribute 以获取有关通过JavaScript访问该值的更多信息。
英文:
give your html element a "value" attribute and set it's value to the gender value it denotes.
also read: https://developer.mozilla.org/en-US/docs/Web/API/Element/getAttribute
for more insight on accessing the value via javaScript
答案2
得分: 1
你需要为每个选项/单选按钮设置一个值。现在你可以通过名称(gender
)来获取值。在提交事件的回调中,e.target
是表单元素。
for
属性在 <label>
中只对ID有效。跳过ID,将输入作为标签的子元素将正常工作。
<form name="form01">
<label>Female <input type="radio" name="gender" value="female" required></label>
<label>Male <input type="radio" name="gender" value="male"></label>
<label>Transgender <input type="radio" name="gender" value="transgender"></label>
<button type="submit">Submit</button>
</form>
document.forms.form01.addEventListener('submit', e => {
e.preventDefault();
console.log(e.target.gender.value);
});
英文:
You need to give each option/radio button a value. And now you can ask for the value on the name (gender
). The e.target
in the submit event callback is the form element.
The for
attribute on <label>
only work for IDs. Skip the IDs and have the input as a child to label will work fine.
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
document.forms.form01.addEventListener('submit', e => {
e.preventDefault();
console.log(e.target.gender.value);
});
<!-- language: lang-html -->
<form name="form01">
<label>Female <input type="radio" name="gender" value="female" required></label>
<label>Male <input type="radio" name="gender" value="male"></label>
<label>Transgender <input type="radio" name="gender" value="transgender"></label>
<button type="submit">Submit</button>
</form>
<!-- end snippet -->
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论