我希望每个模态都有一个唯一的ID。但我实际上在做的是给我:
语法错误,无法识别的表达式:#myModal(7)
以下是我的代码:
<tbody class="tbodyBookTable">
@foreach (var item in Model)
{
<tr class="trBookTable">
<th>@Html.DisplayFor(modelItem => item.Title)</th>
<th>@Html.DisplayFor(modelItem => item.Author)</th>
<th>@Html.DisplayFor(modelItem => item.DateRented)</th>
<th>@Html.DisplayFor(modelItem => item.ReturnDate)</th>
<th>
<button type="button" class="btn btn-default" data-toggle="modal" data-target="#myModal(@Html.DisplayFor(modelItem => item.BookID))">Yes</button>
<!-- Modal -->
<div class="modal fade" id="#myModal(@Html.DisplayFor(modelItem => item.BookID))" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Return confirmation</h4>
</div>
<div class="modal-body">
<p>Are you sure you want to return this book?.</p>
<p>Book title:@Html.DisplayFor(modelItem => item.Title)</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Yes</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</th>
</tr>
}
</tbody>
如您所见,我将data-target
设为
#myModal(@ Html.DisplayFor(modelItem =&gt; item.BookID))
和我模型的id以同样的方式。我不明白为什么我会收到这个错误。有什么帮助吗?
答案 0 :(得分:2)
从id
声明中删除#标签符号(#):
<div id='myModal(' + @Html.DisplayFor(item => item.BookID) + ')'></div>
data-target
使用#标签符号,因为它会直接放入jQuery中以查找元素。在编写HTML元素的id
时,不要编写#
符号。
答案 1 :(得分:0)
您没有正确构建id
。使用这些:
<div id='myModal(' + @Html.DisplayFor(item => item.BookID) + ')'></div>
由于#
可能存在冲突,因此请勿在元素ID中使用。