Adding foreach loop in my view Razor page - html

Question

I use the below code for my view Razor page and it works completely, but when I added my foreach loops based on my project's needs ,It does not show anything when I run the project. I want to help me to find my error in order to fix post form tag functionality.
#page
#model PracticeWithVideo.Pages.Admin.Order.ManageOrderModel
<h1
class="text-primary py-3">Manage Order's</h1> <form method="post">
<div class="container row bg-white p-2 mb-3 rounded">
<div class="col-12 pb-3 pt-3 mt-4 border rounded">
<div class="row">
<div class="col-4">
Order Number : xxx
<ul class="text-info">
</ul>
</div>
<div class="col-4 pb-2">
<div class="input-group pb-2">
<div class="input-group-append">
<span class="input-group-text bg-secondary border">Time</span>
</div>
<input type="text" class="form-control" readonly />
</div>
<textarea readonly class="rounded border form-control" rows="3"></textarea>
</div>
<div class="col-3 offset-1 d-flex align-content-center">
<div class="col-12">
<button type="submit" class="btn btn-primary form-control mb-3">
<i class="bi bi-check-square"></i> Start Cooking
</button>
<button type="submit" class="btn btn-success form-control mb-3">
<i class="bi bi-emoji-laughing"></i> Order Ready
</button>
<button type="submit" class="btn btn-warning form-control mb-3">
<i class="bi bi-x-square-fill"></i> Cancel Order
</button>
</div>
</div>
</div>
</div>
</div>
</form>
and this is my code with foreach loops:
#page
#model PracticeWithVideo.Pages.Admin.Order.ManageOrderModel
<h1 class="text-primary py-3">Manage Order's</h1>
<form method="post">
<div class="container row bg-white p-2 mb-3 rounded">
#foreach (var item in Model.OrderDetailVM)
{
<div class="col-12 pb-3 pt-3 mt-4 border rounded">
<div class="row">
<div class="col-4">
Order Number: #item.OrderHeader.Id
<ul class="text-info">
#foreach (var details in item.OrderDetails)
{
<li>#details.Name x #details.Count</li>
}
</ul>
</div>
<div class="col-4 pb-2">
<div class="input-group pb-2">
<div class="input-group-prepend">
<span class="input-group-text bg-secondary border">Time</span>
</div>
<input type="text" value="#item.OrderHeader.PickUpTime" class="form-control" readonly />
</div>
<textarea readonly asp-for="#item.OrderHeader.Comments" class="rounded border form-control" rows="3"></textarea>
</div>
<div class="col-3 offset-1 d-flex align-content-center">
<div class="col-12">
<button type="submit" class="btn btn-primary form-control mb-3">
<i class="bi bi-check-square"></i> Start Cooking
</button>
<button type="submit" class="btn btn-success form-control mb-3">
<i class="bi bi-emoji-laughing"></i> Order Ready
</button>
<button type="submit" class="btn btn-warning form-control mb-3">
<i class="bi bi-x-square-fill"></i> Cancel Order
</button>
</div>
</div>
</div>
</div>
}
</div>
</form>