租赁网站搜索结果显示数量调整:从9改为15(@foreach实现)
Hey Austin, let's tackle this pagination issue together! You're currently using a @foreach loop to show 9 rental items, and want to bump that up to 15 per page. The fix involves adjusting how you fetch your data (to paginate correctly) and updating your view to handle the paginated set. Here's how to do it based on two common frameworks that use @foreach:
1. Update your data retrieval logic
If you're using Entity Framework Core, you'll need to modify your controller/page model to fetch 15 items at a time instead of 9. You can either handle pagination manually or use the built-in PaginatedList helper:
Manual pagination example:
public IActionResult Index(int pageNumber = 1) { const int pageSize = 15; // Changed from 9 to 15 here var totalItems = _context.RentalItems.Count(); var items = _context.RentalItems .OrderBy(i => i.CreatedAt) // Critical for consistent page results .Skip((pageNumber - 1) * pageSize) .Take(pageSize) .ToList(); // Pass pagination metadata to the view (optional but helpful) ViewBag.CurrentPage = pageNumber; ViewBag.TotalPages = (int)Math.Ceiling(totalItems / (double)pageSize); return View(items); }
Using the built-in PaginatedList (recommended):
First, make sure you have the PaginatedList class set up (it's included in most default ASP.NET Core templates). Then:
public async Task<IActionResult> Index(int pageNumber = 1) { var items = await _context.RentalItems .OrderBy(i => i.CreatedAt) .PaginatedListAsync(pageNumber, 15); // 15 = new page size return View(items); }
2. Update your Razor view
Your @foreach loop will mostly stay the same, but you'll want to add pagination controls to let users navigate between pages:
@model PaginatedList<RentalItem> <!-- Or List<RentalItem> if using manual pagination --> @foreach (var item in Model) { <!-- Your existing item display code here --> <div class="rental-item"> <h3>@item.Title</h3> <p>@item.Description</p> <!-- More item details --> </div> } <!-- Pagination controls --> <div class="pagination"> @if (Model.HasPreviousPage) { <a asp-action="Index" asp-route-pageNumber="@(Model.PageIndex - 1)">← Previous</a> } @for (int i = 1; i <= Model.TotalPages; i++) { <a asp-action="Index" asp-route-pageNumber="@i" class="@(i == Model.PageIndex ? "active" : "")">@i</a> } @if (Model.HasNextPage) { <a asp-action="Index" asp-route-pageNumber="@(Model.PageIndex + 1)">Next →</a> } </div>
1. Adjust your controller logic
Laravel makes pagination super straightforward with its built-in paginate() method. Just change the number from 9 to 15:
public function index() { // Fetch 15 items per page, ordered by creation date $rentalItems = \App\Models\RentalItem::orderBy('created_at', 'desc') ->paginate(15); return view('rental-items.index', compact('rentalItems')); }
2. Update your Blade view
Your @foreach loop works exactly like before, and Laravel handles the heavy lifting for pagination links:
@foreach ($rentalItems as $item) <div class="rental-item-card"> <h3>{{ $item->title }}</h3> <p>{{ Str::limit($item->description, 100) }}</p> <!-- Your item display code --> </div> @endforeach <!-- Built-in pagination links (customizable with CSS) --> <div class="pagination-controls"> {{ $rentalItems->links() }} </div>
- Always sort your data: Adding an
OrderBy(ASP.NET) ororderBy()(Laravel) clause ensures that items don't shift randomly between pages. - Test edge cases: Make sure to check scenarios where there are fewer than 15 items, or when users navigate to the last page.
- Style pagination controls: Default pagination links are functional but plain—add some CSS to match your rental site's design!
内容的提问来源于stack exchange,提问作者Austin

