First of all, I apologize for writing English, which may not be correct.
In the Asp.Net Core project view, I want innerHTML to capture multiple Span tags, each represented by a loop, using JavaScript and display the sum of them in another tag. But I can only get the value of one tag with a specific name or ID and I can not get the value of innerHTML from multiple tags with one name.
Thank you for your guidance
Loop in elements Table:
@foreach (var R in Model.Where(x => x.ReportRDId == show.ReportRDId))
{
<tr>
<td>
<span>@R.CourseName</span>
+
<span>@R.SectionName</span>
+
<span name="test-@R.ReportDayName">@R.TestCount <span>تست </span> </span>
+
<span >@R.TimeCount <span>ساعت </span> </span>
</td>
</tr>
}
I tried to make the name of each tag unique by using a value obtained from the loop The name of each tag is correct, but I can not read the name correctly in JavaScript
My JavaScript Code :
@foreach (var R in Model.GroupBy(x => x.ReportRDId).Select(x => x.FirstOrDefault()))
{
<script>
//To display the sum of the tests
var Total = document.getElementsByName("TotalTest-@R.ReportDayName");
//Tests innerHTML
var test = document.querySelectorAll("[name='test-@R.ReportDayName']");
//loop in test variable
var count = 0;
console.log(test);
test.forEach(e => {
console.log(e.innerHTML);
count += parseInt(e.innerHTML);
Total.forEach(element => {
element.innerHTML = count;
});
});
</script>
}
I did these things but the result I got was wrong
Browser Inspect view for one of the tags (Pay attention to the value of its name):
<script>
//To display the sum of the tests
var Total = document.getElementsByName("TotalTest-شنبه");
//Tests innerHTML
var test = document.querySelectorAll("[name='test-شنبه']");
//loop in test variable
var count = 0;
console.log(test);
test.forEach(e => {
console.log(e.innerHTML);
count += parseInt(e.innerHTML);
Total.forEach(element => {
element.innerHTML = count;
});
});
I solved the problem My mistake was to use only @ R.ReportDayName instead of @ Html.Raw (@ R.ReportDayName).
The correct solution (Attention to @Html.Raw(@R.ReportDayName) ):
@foreach (var item in Model.GroupBy(x => x.ReportRDId).Select(x => x.FirstOrDefault()).Take(1))
{
<text>
//To display the sum of the tests
var Total = document.getElementsByName("TotalTest-@Html.Raw(R.ReportDayName)");
//Tests innerHTML
var test = document.querySelectorAll("[name='test-@Html.Raw(R.ReportDayName)']");
//loop in test variable
var count = 0;
console.log(test);
test.forEach(e =>
{
console.log(e.innerHTML);
count += parseInt(e.innerHTML);
Total.forEach(element =>
{
element.innerHTML = count;
});
});
</text>
}