by Anonymous » 12 Mar 2025, 11:01
Hier ist eine seltsame: < /p>
Ich habe eine Blazor -Kontaktlistenseite und wenn ich nach unten scrolle und auf einen Kontakt klicke, um zur Detail -Seite zu gehen. Die Detail -Seite wird nach unten gescrollt. Wenn ich den ersten Datensatz auf der Kontaktliste auswähle und zur Detail -Seite gehe, befindet sie sich ganz oben auf Details. Es scheint, als ob ich ein wenig auf der Kontaktliste nach unten scrolle. Klingt das seltsam oder was?
Code: Select all
@page "/contact-list"
@rendermode InteractiveServer
@using AutoMapper
@inject ContactService ContactService
@inject IMapper Mapper
@inject NavigationManager Navigation
@inject IJSRuntime JS
Contacts
Contacts
New
✖
First @if (currentSortField == "FirstName")
{
@(isAscending ? "↑" : "↓")
}
Last @if (currentSortField == "LastName")
{
@(isAscending ? "↑" : "↓")
}
@if (isAdding)
{
Cancel
Save
First Name
Last Name
}
@foreach (var contact in PagedContacts)
{
@contact.FirstName
@contact.LastName
}
@if (totalPages > 1)
{
Previous
Page @currentPage of @totalPages
Next
}
@code {
private List contacts = new();
private string searchTerm = string.Empty;
private const int PageSize = 1000;
private int currentPage = 1;
private int totalPages => (int)Math.Ceiling((double)contacts.Count / PageSize);
private string currentSortField = "FirstName";
private bool isAscending = true;
private Timer _debounceTimer;
private List PagedContacts => contacts
.Where(c => string.IsNullOrEmpty(searchTerm) || c.FirstName.Contains(searchTerm, StringComparison.OrdinalIgnoreCase) || c.LastName.Contains(searchTerm, StringComparison.OrdinalIgnoreCase))
.OrderByDynamic(currentSortField, isAscending)
.Skip((currentPage - 1) * PageSize)
.Take(PageSize)
.ToList();
private Contact newContact = new();
private bool isAdding = false;
private bool CanPrevPage => currentPage > 1;
private bool CanNextPage => currentPage < totalPages;
protected override async Task OnInitializedAsync()
{
contacts = await ContactService.GetContactsAsync();
}
private void EditContact(Guid id)
{
Navigation.NavigateTo($"/contact-detail/{id}");
}
private void AddContact()
{
isAdding = true;
}
private void CancelAdd()
{
isAdding = false;
newContact = new();
}
private async Task HandleValidSubmit()
{
await ContactService.AddContactAsync(newContact);
contacts = await ContactService.GetContactsAsync(); // Refresh the contact list
newContact = new(); // Reset the form
isAdding = false; // Exit the add mode
}
private async Task ConfirmDelete(Guid id)
{
bool confirmed = await JS.InvokeAsync("confirm", $"Are you sure you want to delete this contact?");
if (confirmed)
{
await ContactService.DeleteContactAsync(id);
contacts = await ContactService.GetContactsAsync(); // Refresh the contact list
}
}
private void PrevPage()
{
if (CanPrevPage)
{
currentPage--;
}
}
private void NextPage()
{
if (CanNextPage)
{
currentPage++;
}
}
private void SortContacts(string field)
{
if (currentSortField == field)
{
isAscending = !isAscending; // Toggle sorting order
}
else
{
currentSortField = field;
isAscending = true; // Default to ascending order when field changes
}
}
private void SearchChanged(ChangeEventArgs e)
{
searchTerm = e.Value.ToString();
_debounceTimer?.Dispose();
_debounceTimer = new Timer(_ => InvokeAsync(StateHasChanged), null, 500, Timeout.Infinite); // 500ms delay
}
private void ClearSearch()
{
searchTerm = string.Empty;
InvokeAsync(StateHasChanged);
}
}
< /code>
Details Seite < /p>
@page "/contact-detail/{id:guid}"
@rendermode InteractiveServer
@using AutoMapper
@inject ContactService ContactService
@inject IMapper Mapper
@inject NavigationManager Navigation
Edit Contact
Edit Contact
Cancel
Save
First Name:
Middle Name:
Last Name:
Nick Name:
Birth Date:
Publish Permission:
@code {
[Parameter]
public Guid Id { get; set; }
private Contact contact = new();
protected override async Task OnInitializedAsync()
{
contact = await ContactService.GetContactByIdAsync(Id);
}
private async Task HandleValidSubmit()
{
await ContactService.UpdateContactAsync(contact);
Navigation.NavigateTo("/contact-list");
}
private void Cancel()
{
Navigation.NavigateTo("/contact-list");
}
}
Hier ist eine seltsame: < /p>
Ich habe eine Blazor -Kontaktlistenseite und wenn ich nach unten scrolle und auf einen Kontakt klicke, um zur Detail -Seite zu gehen. Die Detail -Seite wird nach unten gescrollt. Wenn ich den ersten Datensatz auf der Kontaktliste auswähle und zur Detail -Seite gehe, befindet sie sich ganz oben auf Details. Es scheint, als ob ich ein wenig auf der Kontaktliste nach unten scrolle. Klingt das seltsam oder was?[code]@page "/contact-list"
@rendermode InteractiveServer
@using AutoMapper
@inject ContactService ContactService
@inject IMapper Mapper
@inject NavigationManager Navigation
@inject IJSRuntime JS
Contacts
Contacts
New
✖
First @if (currentSortField == "FirstName")
{
@(isAscending ? "↑" : "↓")
}
Last @if (currentSortField == "LastName")
{
@(isAscending ? "↑" : "↓")
}
@if (isAdding)
{
Cancel
Save
First Name
Last Name
}
@foreach (var contact in PagedContacts)
{
@contact.FirstName
@contact.LastName
}
@if (totalPages > 1)
{
Previous
Page @currentPage of @totalPages
Next
}
@code {
private List contacts = new();
private string searchTerm = string.Empty;
private const int PageSize = 1000;
private int currentPage = 1;
private int totalPages => (int)Math.Ceiling((double)contacts.Count / PageSize);
private string currentSortField = "FirstName";
private bool isAscending = true;
private Timer _debounceTimer;
private List PagedContacts => contacts
.Where(c => string.IsNullOrEmpty(searchTerm) || c.FirstName.Contains(searchTerm, StringComparison.OrdinalIgnoreCase) || c.LastName.Contains(searchTerm, StringComparison.OrdinalIgnoreCase))
.OrderByDynamic(currentSortField, isAscending)
.Skip((currentPage - 1) * PageSize)
.Take(PageSize)
.ToList();
private Contact newContact = new();
private bool isAdding = false;
private bool CanPrevPage => currentPage > 1;
private bool CanNextPage => currentPage < totalPages;
protected override async Task OnInitializedAsync()
{
contacts = await ContactService.GetContactsAsync();
}
private void EditContact(Guid id)
{
Navigation.NavigateTo($"/contact-detail/{id}");
}
private void AddContact()
{
isAdding = true;
}
private void CancelAdd()
{
isAdding = false;
newContact = new();
}
private async Task HandleValidSubmit()
{
await ContactService.AddContactAsync(newContact);
contacts = await ContactService.GetContactsAsync(); // Refresh the contact list
newContact = new(); // Reset the form
isAdding = false; // Exit the add mode
}
private async Task ConfirmDelete(Guid id)
{
bool confirmed = await JS.InvokeAsync("confirm", $"Are you sure you want to delete this contact?");
if (confirmed)
{
await ContactService.DeleteContactAsync(id);
contacts = await ContactService.GetContactsAsync(); // Refresh the contact list
}
}
private void PrevPage()
{
if (CanPrevPage)
{
currentPage--;
}
}
private void NextPage()
{
if (CanNextPage)
{
currentPage++;
}
}
private void SortContacts(string field)
{
if (currentSortField == field)
{
isAscending = !isAscending; // Toggle sorting order
}
else
{
currentSortField = field;
isAscending = true; // Default to ascending order when field changes
}
}
private void SearchChanged(ChangeEventArgs e)
{
searchTerm = e.Value.ToString();
_debounceTimer?.Dispose();
_debounceTimer = new Timer(_ => InvokeAsync(StateHasChanged), null, 500, Timeout.Infinite); // 500ms delay
}
private void ClearSearch()
{
searchTerm = string.Empty;
InvokeAsync(StateHasChanged);
}
}
< /code>
Details Seite < /p>
@page "/contact-detail/{id:guid}"
@rendermode InteractiveServer
@using AutoMapper
@inject ContactService ContactService
@inject IMapper Mapper
@inject NavigationManager Navigation
Edit Contact
Edit Contact
Cancel
Save
First Name:
Middle Name:
Last Name:
Nick Name:
Birth Date:
Publish Permission:
@code {
[Parameter]
public Guid Id { get; set; }
private Contact contact = new();
protected override async Task OnInitializedAsync()
{
contact = await ContactService.GetContactByIdAsync(Id);
}
private async Task HandleValidSubmit()
{
await ContactService.UpdateContactAsync(contact);
Navigation.NavigateTo("/contact-list");
}
private void Cancel()
{
Navigation.NavigateTo("/contact-list");
}
}
[/code]
Mobile version