【发布时间】：2021-12-23 23:06:38
【问题描述】：
我使用了两种类似的形式，一种用于选择类别，因此与该类别相关的书籍将显示在下面。每本书里面有一个模态表单从图书馆借书，但我的问题是，里面的模态表单可以打开但不能动作。我不知道为什么。任何人都可以帮助我。演示图片如下
@using (Html.BeginForm("Index", "BorrowBook", FormMethod.Post, new { name = "demoForm" }))
{
@Html.DropDownList("id_category", (IEnumerable<SelectListItem>)ViewBag.listTest, "-- Tất Cả Thể Loại --",
new { onchange = "SelectedIndexChanged()" })
<div style="display: flex; flex-direction: row; flex-wrap: wrap;">
@foreach (var item in ViewBag.list)
{
var itemName = "#exampleModalss" + item.id_book;
var itemName1 = "exampleModalss" + item.id_book;
<div class="movies-box" style="height: 430px;width: 250px; display: flex; justify-content: space-between; align-items: center; flex-direction: column; box-shadow: 2px 2px 30px rgb(0 0 0 / 20%); margin: 20px; border-radius: 5px; overflow: hidden; border-top: 3px solid #292929;">
<!--img------------>
<a href="#">
<div class="movies-img">
<img src="/Content/assets/img/@item.image" style=" width: 250px; height: 300px; object-fit: cover;" />
</div>
</a>
<h3 style="font-weight:bold">@item.name</h3>
<p>Số lượng còn lại: @item.quantity</p>
@if (item.quantity != 0)
{
<div style="margin-bottom:20px" class="button--movie">
<button type="button" class="btn btn-success" data-bs-toggle="modal" data-bs-target="@itemName">Thuê sách</button>
</div>
}
else
{
<div style="margin-bottom:20px" class="button--movie">
<button type="button" class="btn btn-danger" data-bs-toggle="modal" value="Disabled">Hết sách</button>
</div>
}
</div>
<div class="modal fade" id="@itemName1" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-xl">
@*<form action="/BorrowBook/Add" method="post">*@
<div class="modal-content">
<form action="/BorrowBook/Add" method="post">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">@item.name</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div id="resultss" class="modal-body">
<div class="row">
<div class="col-4">
<div class="movies-img">
<img src="/Content/assets/img/@item.image" style=" width: 300px; height: 400px; object-fit: cover;" />
</div>
</div>
<div class="col-4">
<h5>Thông tin sách</h5>
<div class="">
<label for="category-film" class="col-form-label" style="font-weight:bold;width : 140px">Tên sách</label>
: @item.name
</div>
<div class="">
<label for="category-film" class="col-form-label" style="font-weight:bold;width : 140px">Tác giả</label>
: @item.author
</div>
@foreach (var item1 in ViewBag.listP)
{
if (item1.id_publisher == item.id_publisher)
{
<div class="">
<label for="category-film" class="col-form-label" style="font-weight:bold;width : 140px">Tên nhà xuất bản</label>
: @item1.name
</div>
}
}
<div class="">
<label for="category-film" class="col-form-label" style="font-weight:bold;width : 140px">Năm xuất bản</label>
: @item.year_publish
</div>
@foreach (var item2 in ViewBag.listC)
{
if (item2.id_category == item.id_category)
{
<div class="">
<label for="category-film" class="col-form-label" style="font-weight:bold;width : 140px">Tên thể loại</label>
: @item2.name
</div>
}
}
<div class="">
<label for="category-film" class="col-form-label" style="font-weight:bold;width : 140px">Price</label>
: @item.price VND
</div>
<div class="">
<label for="category-film" class="col-form-label" style="font-weight:bold;width : 140px">Mô tả:</label>
<br> @item.description
</div>
</div>
<div class="col-4">
<h5>Thông tin sinh viên</h5>
<div class="">
<label for="category-film" class="col-form-label" style="font-weight:bold;width : 140px">Tên sinh viên:</label>
: @userInfomatiom.fullname
</div>
<div class="">
<label for="category-film" class="col-form-label" style="font-weight:bold;width : 140px">Địa chỉ:</label>
: @userInfomatiom.address
</div>
<div class="">
<label for="category-film" class="col-form-label" style="font-weight:bold;width : 140px">Số điện thoại:</label>
: @userInfomatiom.phone
</div>
<label for="category-film" class="col-form-label">Ngày thuê :</label>
<input type="date" class="form-control" id="tenphim" name="start_time" tabindex="1" min="@dtnoww" required>
<label for="category-film" class="col-form-label">Ngày trả :</label>
<input type="date" class="form-control" name="end_time" tabindex="1" value="" min="@dtnoww" required>
<input type="hidden" class="form-control" name="idUser" tabindex="1" value="@userInfomatiom.id_user" hidden>
<input type="hidden" class="form-control" name="idBook" tabindex="1" value="@item.id_book" hidden>
</div>
</div>
</div>
<div class="modal-footer">
<button style="width:100px" type="submit" class="btn btn-primary">Thuê</button>
</div>
</form>
</div>
@*</form>*@
</div>
</div>
}
</div>
}
更改类别的脚本
<script type="text/javascript">
function SelectedIndexChanged() {
document.demoForm.submit();
}
</script>
当我点击每本书时，它可以显示这样的模式，但是当我点击提交按钮时，它无法响应。
当我检查元素时，我无法从内部看到（表单模式）
我需要帮助。谢谢
【问题讨论】：
标签： c# asp.net .net asp.net-core