Sobes.tech
Middle

INN laukas (10 arba 12 skaitmenys). Po blur parodyti klaidą. Siuntimo mygtukas yra išjungtas, kol forma nėra galiojanti.

sobes.tech AI

Atsakymas iš AI

Su INN laukas su 10 arba 12 skaitmenų patvirtinimu, klaidos rodymu po blur ir "Siųsti" mygtuko blokavimu tol, kol forma nėra galiojanti, galima padaryti taip (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 turi būti sudarytas iš 10 arba 12 skaitmenų</div>
      )}
      <button type="submit" disabled={!isValid}>Siųsti</button>
    </form>
  );
}

export default InnForm;
```\n\nČia:\n- Validacija tikrina, ar INN sudaro tiksliai 10 arba 12 skaitmenų.\n- Klaida rodomas tik po to, kai laukas praranda fokusą (`blur`).\n- "Siųsti" mygtukas yra išjungtas, kol INN nėra galiojantis.