我建立了一个学校网站,教师可以上传学生的网站。分数。到目前为止,我有这三个文件:
第一个,将根据主题和课程显示每个学生的姓名
<table class="check">
<tr class="arrow">
<th>Student</th>
<th>Add Mark</th>
</tr>
@foreach(var users in user){
<tr class="arrow">
<td>@users.Nombre @users.Apellido</td>
<td>
<form method="post">
<input type="text" id="user" style="display: none" name="user" @Validation.For("nombre") value="@users.UserId" />
<input type="text" id="galleryId" style="display: none" name="galleryId" @Validation.For("nombre") value="@galleryId" />
<input type="text" id="note" name="button2" name="note" @Validation.For("nombre") />
<input type="button" value="Ready" title="Ready" onclick="loco(document.getElementById('user').value, document.getElementById('galleryId').value, document.getElementById('note').value)" />
</form>
</td>
</tr>
}
</table>
在这里,您可以看到我使用foreach
来显示每个学生的姓名,然后在旁边显示一个输入文本框,供教师编写特定学生的标记。这就是我将表单包含在foreach
中的原因。
接下来是ajax文件:
function loco(user, gallery, note) {
var xmlhttp;
var user = document.getElementById("user").value;
var galleryid = document.getElementById("galleryId").value;
var note = document.getElementById("note").value;
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET", "/Marks/add1/" + gallery + "/" + user + "/" + note, true);
xmlhttp.send();
}
最后,我们有一个页面,它会将标记插入数据库而不返回任何表格或div,只需上传标记。
@{
var db2 = Database.Open("ica");
var user = UrlData[1];
var galleryId = UrlData[0];
var note = UrlData[2].AsInt();
db2.Execute("INSERT INTO Notas (Nota, UserId, Sub_Id) VALUES (@0, @1, @2)", note, user, galleryId);
}
那么,为什么ajax会将第一个学生的值发送到上传文件而不是第二个,第三个等?为什么,当我点击第二个学生的提交按钮时,它会再次发送第一个学生的标记,只发送第一个学生的标记?
答案 0 :(得分:2)
您在for-each循环中的HTML中使用了硬编码ID,因此您将在页面上使用user
,galleryId
的相同ID获取多个元素, note
。这意味着您的选择器只能选择第一个,无论您实际尝试使用哪个。您需要执行一些操作,例如在ID的末尾添加索引号而不是完全硬编码的ID,以便它们可以彼此区分。
答案 1 :(得分:2)
注意:强>
我发现你在同一输入中多次使用名字请删除:
<input type="text" id="note" name="button2" name="note" @Validation.For("nombre") />
此处您的姓名为button2
以及note
请删除button2
进行如下更改:
function loco(form) {
var xmlhttp;
var user = form.name.value;
var gallery = form.galleryId.value;
var note = form.note.value;
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET", "/Marks/add1/" + gallery + "/" + user + "/" + note, true);
xmlhttp.send();
return false;
}
更改与html相关的代码,如下所示:
<form onsubmit="return loco(this)">
<input type="text" id="user" style="display: none" name="user" @Validation.For("nombre") value="@users.UserId" />
<input type="text" id="galleryId" style="display: none" name="galleryId" @Validation.For("nombre") value="@galleryId" />
<input type="text" id="note" name="note" @Validation.For("nombre") />
<input type="submit" value="Ready" title="Ready" />
</form>