MudBlazor: Wie aktiviere ich Tausendertrennzeichen in Echtzeit in einer benutzerdefinierten Dezimaleingabekomponente?C#

Ein Treffpunkt für C#-Programmierer
Guest
 MudBlazor: Wie aktiviere ich Tausendertrennzeichen in Echtzeit in einer benutzerdefinierten Dezimaleingabekomponente?

Post by Guest »

Ich baue eine Blazor-Komponente, die ein MudTextField verwendet, um Dezimalzahlen zu akzeptieren und sie mit Tausendertrennzeichen in Echtzeit anzuzeigen. Ich möchte, dass die Formatierung wirksam wird, sobald der Benutzer etwas eingibt (z. B. sollte die Eingabe von 123456,78 zu 123.456,78 werden). Außerdem benötige ich das Feld, um den gesamten Text im Fokus automatisch auszuwählen.
Hier ist mein aktueller Code. Der Text wird erst dann mit Kommaformatierung angezeigt, wenn der Fokus verloren geht, und nicht bei jedem Tastendruck:

Code: Select all

@using System.Globalization



@code
{
[Parameter] public decimal? Value { get; set; }
[Parameter] public EventCallback ValueChanged { get; set; }
[Parameter] public string? Placeholder { get; set; }
[Parameter] public Variant Variant { get; set; } = Variant.Outlined;
[Parameter] public string Class { get; set; } = string.Empty;

private MudTextField _input = default!;
private string _displayValue = string.Empty;

protected override void OnInitialized()
{
if (Value.HasValue)
{
_displayValue = FormatNumber(Value.Value);
}
}

private void OnTextChanged(string newValue)
{
var raw = newValue.Replace(",", "");
if (decimal.TryParse(raw, out var parsed))
{
Value = parsed;
ValueChanged.InvokeAsync(parsed);
_displayValue = FormatNumber(parsed);
}
else
{
_displayValue = newValue;
}
}

private async Task OnInputFocus(FocusEventArgs args)
{
await _input.SelectAsync();
}

private string FormatNumber(decimal number) => number.ToString("###,##0.##", CultureInfo.InvariantCulture);
}

Quick Reply

Change Text Case: 
   
  • Similar Topics
    Replies
    Views
    Last post