Show error message for hidden field

[martialanouman]

Hi everyone!
I;m looking for a way to display hidden input's error message.

I have a custom select component which has a hidden input for storing selected item(s) value(s). I passed name and form and required props down to it.

// custom select comp
<Select
  {...conform.input(coverageId)}
  ...
/>
{!!coverageId.error && coverageId.error}

// internal hidden input
<input
  type="hidden"
  name={name}
  form={form}
  required={required}
  value={selectedId}
/>

The problem i'm facing is that when i submit the form with no value for this field, the error message is not displayed.
It seems that conform does not populate coverageId.error when the field is not visible.

Is there any way i could get and display the error message ?

[edmundhung]

Conform utilizes Constraint Validation APIs such as setCustomValidity to propagate the error messages at the moment. But the element might be barred from constraint validation on certain conditions. For example, the browser does not report error from disabled or hidden type input which is the issue you had.

If you have control over the input element, please use <input hidden> instead.

[martialanouman]

Hi @edmundhung, thanks for you help.

I didn't know this attribute what part of HTML spec. That's exactly what i was looking for.
Thanks a lot.

[martialanouman]

However this doesn't prevent React from logging warning about value prop without onChange handler.