Skip to content

Commit 53aab63

Browse files
authored
Refactor page number input handling in PdfViewer (#63)
Updated the input field in `PdfViewer.razor` to use explicit binding with `@bind:event`, `@bind:get`, and `@bind:set`. Introduced the `OnPageNumberInput` method to enqueue tasks for processing page number changes asynchronously. This improves control over input events and enhances the overall user experience. NOTE: This commit message is auto-generated using GitHub Copilot.
1 parent 3001628 commit 53aab63

2 files changed

Lines changed: 12 additions & 1 deletion

File tree

BlazorExpress.Bulma/Components/PdfViewer/PdfViewer.razor

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,13 @@
1010
<BootstrapIcon Class="@BulmaExpressCssClass.CursorPointer" Name="BootstrapIconName.ChevronDown" Size="BootstrapIconSize.Medium" @onclick="NextPageAsync" title="Next Page" />
1111
</div>
1212
<div class="level-item">
13-
<input class="input is-small" style="width:60px;" type="number" @bind-value="pageNumber" placeholder="Enter page number" />
13+
<input class="input is-small"
14+
style="width:60px;"
15+
type="number"
16+
@bind:event="oninput"
17+
@bind:get="pageNumber"
18+
@bind:set="OnPageNumberInput"
19+
placeholder="Enter page number" />
1420
<div class="pl-2">of @pagesCount</div>
1521
</div>
1622
</div>

BlazorExpress.Bulma/Components/PdfViewer/PdfViewer.razor.cs

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -114,6 +114,11 @@ private int GetZoomPercentage(int zoomLevel) =>
114114

115115
private async Task NextPageAsync() => await PdfViewerJsInterop.NextPageAsync(objRef!, Id!);
116116

117+
private void OnPageNumberInput(int value)
118+
{
119+
queuedTasks.Enqueue(async () => await PageNumberChangedAsync(value));
120+
}
121+
117122
private async Task PageNumberChangedAsync(int value)
118123
{
119124
if (value < 1 || value > pagesCount)

0 commit comments

Comments
 (0)