我有一个包含动态数量输入字段的表单,因此我需要为每个表单创建一个唯一的ID。当我发布其他输入(没有唯一ID的那些输入)时,它们的值会恢复正常。但所有具有唯一ID的输入都未定义。知道为什么会这样吗?
以下是相关的server.js
代码:
app.get('/creategroup', (request, response) => {
var members = [];
var memberCount = 5;
for(var i = 1; i <= memberCount; i++){
name_id = randomString(32, '#aA');
phone_id = randomString(32, '#aA');
var member = {
id: i,
name: '',
name_id: name_id,
phone: '',
phone_id: phone_id
}
members[i-1] = member;
}
app.locals.memberCount = members.length;
app.locals.members = members;
console.log("members: "+app.locals.memberCount+" : "+app.locals.members);
response.render('creategroup', {
memberCount: memberCount,
members: members
})
})
app.post('/creategroup', function(req, res) {
res.header("Content-Type", "application/json");
var group_name = req.body.group_name;
var date = req.body.date;
var price = req.body.price;
var members = app.locals.members;
var memberCount = app.locals.memberCount;
console.log("count: "+memberCount);
for (var i = 1; i <= members.length; i++) {
member = members[i-1];
name_id = member["name_id"];
phone_id = member["phone_id"];
console.log("name: "+name_id);
console.log("phone: "+phone_id);
console.log("Member "+i+": "+req.body.name_id+" : "+req.body.phone_id);
}
})
以下是这些输入字段的相关html:
<div class="inputWrapper">
<h2 class="title">Add group members</h2>
{{#each members}}
<div class="personWrapper">
<div class="personItem">
<label for={{id}}>Name</label>
<input class="nameInput" id={{id}} name={{name_id}} type="text" placeholder="Name">
</div>
<div class="personItem">
<label for={{id}}>Phone Number</label>
<input id={{id}} type="text" name={{phone_id}} placeholder="Phone number">
</div>
</div>
{{/each}}
<p id="addMembers" class="addPeople">Add more people</p>
</div>