How can I limit the number of digits in a custom input field?

[Manager2020]

I've added custom input field with type number, how can I limit the numbers to be 4 only?

MaxLength is not working

This is the code: (I added the code to have one input field of type text, and the other is of type number and this is the one I am asking about)

{%- assign product_form_id = 'product-form-' | append: section.id -%}
{% if product.metafields.custom.needsName.value %}
  <p class="line-item-property__field" style="font-size: 13px;">
    <label for="{{ product_form_id }}-name">Type the Name. Maximum 5 characters</label>
    <br>
    <input form="{{ product_form_id }}" id="{{ product_form_id }}-name" type="text" name="properties[Name]" minlength="1" maxlength="5" style="width:100%; line-height: 40px; border:1px solid #333333;">
  </p>
{% endif %}

{% if product.metafields.custom.needsDate.value %}
  <p class="line-item-property__field" style="font-size: 13px;">
    <label for="{{ product_form_id }}-date">Type the Year. Maximum 4 numbers</label>
    <br>
    <input form="{{ product_form_id }}" id="{{ product_form_id }}-date" type="number" name="properties[Year]” minlength="4" maxlength="4" style="width:100%; line-height: 40px; border:1px solid #333333;" pattern="[1-9]\d{3}">
  </p>
{% endif  %}

[LuffyOnePiece]

Hi @Manager2020 

Replace the code with below one.

{%- assign product_form_id = 'product-form-' | append: section.id -%}
{% if product.metafields.custom.needsName.value %}
  <p class="line-item-property__field" style="font-size: 13px;">
    <label for="{{ product_form_id }}-name">Type the Name. Maximum 5 characters</label>
    <br>
    <input form="{{ product_form_id }}" id="{{ product_form_id }}-name" type="text" name="properties[Name]" minlength="1" maxlength="5" style="width:100%; line-height: 40px; border:1px solid #333333;">
  </p>
{% endif %}

{% if product.metafields.custom.needsDate.value %}
  <p class="line-item-property__field" style="font-size: 13px;">
    <label for="{{ product_form_id }}-date">Type the Year. Exactly 4 numbers</label>
    <br>
    <input form="{{ product_form_id }}" id="{{ product_form_id }}-date" type="number" name="properties[Year]" min="1000" max="9999" style="width:100%; line-height: 40px; border:1px solid #333333;">
  </p>
{% endif %}

Please don't hesitate to reach out if you require further help to optimize or customize your store. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

Best Regards,
LuffyOnePiece

[Manager2020]

Thank you, 

but it is still not working.

[LuffyOnePiece]

Hi @Manager2020 ,

Can you provide me the access so that I can assist on fixing this?

Thank you

[Manager2020]

Thank you I will give you, but I had to change the field type to text again, as the number will not accept other numbers than English

[Manager2020]

I gave you the access code by email