[英]Adding an HTML element (a button to a form) when an event happens (when another button, from another form, is clicked), using EJS?
I am building a Node.js server and using Express. 我正在构建一个Node.js服务器并使用Express。 In an EJS view, I have a form with an event listener, that is, when a given radiobutton is clicked, a function is called:
在EJS视图中,我有一个带有事件侦听器的表单,即单击给定的单选按钮时,将调用一个函数:
// the way thearray is created is omitted
<% for(var i=0; i<therray.length; i++) { %>
// parts omitted
<td>
<form id= <%= "question_examen"+i %> > // the form that triggers the event
<input type="radio" id= <%= "examen_non"+i %> name="examen" value="non" checked>Non
<input type="radio" id= <%= "examen_oui"+i %> name="examen" value="<%= i %>" onClick= <%= "exam("+i+")" %>>Oui
</form>
</td>
<td>
<form id= <%= "question_selection"+i %> > // the second form, empty at the beginning, but that I want to enrich (see below)
</form>
</td>
// parts omitted
<% } %>
I want the function exam(i), that is trigerred by the first form, to add new radiobuttons to the second form. 我希望第一种形式触发的函数check(i)将新的单选按钮添加到第二种形式。 This is my function:
这是我的功能:
<script type='application/javascript'>
function exam(i) {
alert(i); // just to check it is correctly triggered (it is the case)
// code with mistakes, I guess, since it's not working:
document.createElement("inputnon");
input.type ="radio";
input.id= <%= "selection_non"+i %>;
input.name="selection";
input.value="non";
input.innerHTML="Non";
document.getElementById("#question_selection"+i).appendChild(inputnon);
document.createElement("inputoui");
input.type ="radio";
input.id= <%= "selection_oui"+i %>;
input.name="selection";
input.value="oui";
input.innerHTML="Oui";
document.getElementById("#question_selection"+i).appendChild(inputoui);
}
</script>
Many mistakes indeed :) 确实有很多错误:)
1) you are trying to access the second form using the wrong id 1)您正在尝试使用错误的ID访问第二个表单
<form id= <%= "selection_examen"+i %> >...
...
document.getElementById("#question_selection"+i).appendChild(inputoui);
2) you need to concat the input's id using straight js, no EJS is needed. 2)您需要使用直接js来连接输入的ID,不需要EJS。
To fix it do this: 要解决此问题,请执行以下操作:
input.id= "selection_non"+i;
Instead of: 代替:
input.id= <%= "selection_non"+i %>;
3) you are creating an element without declaring and assigning it to a variable, and the element you were creating wasn't a valid input 3)您在创建元素时未声明并将其分配给变量,并且您正在创建的元素不是有效的输入
To fix it do this: 要解决此问题,请执行以下操作:
var inputnon = document.createElement("input");
inputnon.type ="radio";
...
Instead of this: 代替这个:
document.createElement("inputnon");
input.type ="radio";
...
input.innerHTML="Non"; ... input.innerHTML="Oui";
Try the following code (did not run it though, so it might have more errors): 尝试以下代码(虽然未运行,所以可能会有更多错误):
<script>
function exam(i) {
alert(i); // just to check it is correctly triggered (it is the case)
// hopefully the following code will run:
var inputnon = document.createElement("input");
inputnon.type ="radio";
inputnon.id= "selection_non"+i;
inputnon.name="selection";
inputnon.value="non";
document.getElementById("question_selection"+i).appendChild(inputnon);
var inputoui = document.createElement("input");
inputoui.type ="radio";
inputoui.id= "selection_oui"+i;
inputoui.name="selection";
inputoui.value="oui";
document.getElementById("question_selection"+i).appendChild(inputoui);
}
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.