在具有隐藏 asp-for 输入的剃刀页面中使用 foreach 会导致在浏览器控制台中找到具有非唯一 ID 的元素
Using foreach in razor pages with hidden asp-for inputs result in found elements with non-unique id in browser console
我有两个偏音。一个是 _ProductList.cshtml:
@model IList<ProductDto>
@foreach (var product in Model) {
<div class="col-md-4 col-sm-6 px-2 mb-4">
<partial name="_SingleProduct" for="@product"/>
</div>
}
和_SingleProduct.cshtml:
@model ProductDto
<form method="post" asp-page="/Basket/Index" class="text-center">
<div class="card-body card-body-hidden">
<h4 class="fs-sm">@Model.AtlantisCode</h4>
@if (Model.Availability) {
<button class="btn btn-primary btn-sm d-block w-100 mb-2" type="submit">
<i class="ci-cart fs-sm me-1"></i>Προσθήκη στο καλάθι
</button>
}
else {
<button class="btn btn-secondary btn-sm d-block w-100 mb-2" type="submit" asp-page="/Contact/Index" asp-page-handler="ItemInfo">
<i class="ci-mail fs-sm me-1"></i> Ρωτήστε μας
</button>
}
<input type="hidden" asp-for="@Model.Id" name="id" />
<input type="hidden" asp-for="@Model.DisplayPrice" name="displayPrice"/>
<input type="hidden" asp-for="@Model.OfferPrice" name="offerPrice"/>
<input type="hidden" asp-for="@Model.IsOffer" name="isOffer"/>
</div>
</form>
因此,在包含 12 个产品列表的页面中,它会针对每个隐藏的输入生成浏览器警告,例如:
Found 12 elements with non-unique id #Products_Results_product_DisplayPrice
这实际上是有道理的,因为有 12 个元素具有相同的 ID。
有一段时间我用https://github.com/dotnet-architecture/eShopOnWeb检查了一些最佳实践并在我的项目中使用。因此,在 eShopOnWeb 项目中,还有一个带有部分的 foreach,采用相同的技术。而且根本没有任何警告。没有自定义 ID 程序。即使呈现的页面 html 在隐藏输入中也有相同的 ID。但是没有警告。
谁能告诉我为什么?我错过了什么?
谢谢大家,抱歉久了post。
试试这个
<input type="hidden" asp-for="@Model.Id" name="id@Model.Id" />
....and so on
我只是不知道为什么你需要这个名字,因为你已经 asp-for="@Model.Id"
我更愿意
<input type="hidden" asp-for="Id" value="@Model.Id"/>
.... and so on
我有两个偏音。一个是 _ProductList.cshtml:
@model IList<ProductDto>
@foreach (var product in Model) {
<div class="col-md-4 col-sm-6 px-2 mb-4">
<partial name="_SingleProduct" for="@product"/>
</div>
}
和_SingleProduct.cshtml:
@model ProductDto
<form method="post" asp-page="/Basket/Index" class="text-center">
<div class="card-body card-body-hidden">
<h4 class="fs-sm">@Model.AtlantisCode</h4>
@if (Model.Availability) {
<button class="btn btn-primary btn-sm d-block w-100 mb-2" type="submit">
<i class="ci-cart fs-sm me-1"></i>Προσθήκη στο καλάθι
</button>
}
else {
<button class="btn btn-secondary btn-sm d-block w-100 mb-2" type="submit" asp-page="/Contact/Index" asp-page-handler="ItemInfo">
<i class="ci-mail fs-sm me-1"></i> Ρωτήστε μας
</button>
}
<input type="hidden" asp-for="@Model.Id" name="id" />
<input type="hidden" asp-for="@Model.DisplayPrice" name="displayPrice"/>
<input type="hidden" asp-for="@Model.OfferPrice" name="offerPrice"/>
<input type="hidden" asp-for="@Model.IsOffer" name="isOffer"/>
</div>
</form>
因此,在包含 12 个产品列表的页面中,它会针对每个隐藏的输入生成浏览器警告,例如:
Found 12 elements with non-unique id #Products_Results_product_DisplayPrice
这实际上是有道理的,因为有 12 个元素具有相同的 ID。
有一段时间我用https://github.com/dotnet-architecture/eShopOnWeb检查了一些最佳实践并在我的项目中使用。因此,在 eShopOnWeb 项目中,还有一个带有部分的 foreach,采用相同的技术。而且根本没有任何警告。没有自定义 ID 程序。即使呈现的页面 html 在隐藏输入中也有相同的 ID。但是没有警告。
谁能告诉我为什么?我错过了什么?
谢谢大家,抱歉久了post。
试试这个
<input type="hidden" asp-for="@Model.Id" name="id@Model.Id" />
....and so on
我只是不知道为什么你需要这个名字,因为你已经 asp-for="@Model.Id"
我更愿意
<input type="hidden" asp-for="Id" value="@Model.Id"/>
.... and so on