I’m creating a generic form project, the kind of type where you insert a model and the form is generated for you. In order for this to work I now work on a generic input component, which will render specefic attributes for a type (“number”, “string”…).
Only problem – I can’t insert negative values when I’m handling a model with an int (input type=”number”).
When I insert a negetive value and unfocus the input box, the entered value litterally dissapear and I see the followig messege in the browser console (tried to insert -1) :

The specified value “â-1” cannot be parsed, or is out of range.

I’ve tried to set the “min” attribute, but It didn’t do anything.
I know I can change the input type to “text” and implement my own validation, but I really just need that simple support for integers.

For a mysterious reason, the expected behaviour obsereved whenever I debug the app in visual studio, which makes the error even harder to detect.

Here is some of the relevant code:

GenericInputComponent.cs:

namespace GenericInput.Components.GenericInputComponent
{
    public partial class GenericInputComponent<FieldType>
    {
        [Parameter]
        [EditorRequired]
        public FieldType? Field { get; set; }

        [Parameter]
        public EventCallback<FieldType> FieldChanged { get; set; }

        private async Task UpdateFieldFromChild(FieldType? value)
        {
            await FieldChanged.InvokeAsync(value);
        }

        private InputAttributes.InputAttributes _attributes = InputAttributesFactory.GetAttributes(typeof(FieldType));
    }
}

GenericInputComponent.razor :

@typeparam FieldType

<label>Some Label</label>
<input @attributes="_attributes.GetSplattableAttributes()" @bind:get="Field" @bind:set="UpdateFieldFromChild" />

InputAttributes.cs file :

global using SplattableAttributes = System.Collections.Generic.Dictionary<string, object>;

namespace GenericInput.Components.GenericInputComponent.InputAttributes
{
    public class InputAttributes 
    {
        private SplattableAttributes _attributes = new();
        public SplattableAttributes GetSplattableAttributes()
        {
            return _attributes;
        }

        public void Add(string key, object value)
        {
            _attributes.Add(key, value);
        }

        public void Add(SplattableAttributes attrs)
        {
            foreach (var attr in attrs)
            {
                Add(attr.Key, attr.Value);
            }
        }

        public void Remove(string key)
        {
            _attributes.Remove(key);
        }
    }
}

IntInputAttributes.cs :

namespace GenericInput.Components.GenericInputComponent.InputAttributes
{
    public class IntInputAttributes : InputAttributes
    {
        public IntInputAttributes()
        {
            Add("type", "number");
            Add("min", "-5000");
        }
    }
}

Home.razor :

@using GenericInput.Components.GenericInputComponent;
@page "/"

<GenericInputComponent @bind-Field="TestInt"></GenericInputComponent>

<p>
    TestInt value:
</p>

<p>
    @TestInt
</p>

@code
{
    public int TestInt { get; set; } = -1;
}