Middle
Câmpul INN (10 sau 12 cifre). Afișează eroarea după blur. Butonul Trimite este dezactivat până când formularul este valid.
sobes.tech AI
Răspuns de la AI
Pentru câmpul INN cu validare pentru 10 sau 12 cifre, afișarea erorii după blur și blocarea butonului "Trimite" până când formularul nu este valid, poți face așa (în React):
import React, { useState } from 'react';
function InnForm() {
const [inn, setInn] = useState('');
const [touched, setTouched] = useState(false);
const isValidInn = (value) => {
return /^\d{10}$/.test(value) || /^\d{12}$/.test(value);
};
const handleBlur = () => {
setTouched(true);
};
const isValid = isValidInn(inn);
return (
<form>
<label>
INN:
<input
type="text"
value={inn}
onChange={e => setInn(e.target.value)}
onBlur={handleBlur}
maxLength={12}
/>
</label>
{touched && !isValid && (
<div style={{ color: 'red' }}>INN trebuie să conțină 10 sau 12 cifre</div>
)}
<button type="submit" disabled={!isValid}>Trimite</button>
</form>
);
}
export default InnForm;
```\n\nAici:\n- Validarea verifică dacă INN conține exact 10 sau 12 cifre.\n- Eroarea se afișează doar după ce câmpul și-a pierdut focusul (`blur`).\n- Butonul "Trimite" este dezactivat atâta timp cât INN nu este valid.