Sobes.tech
Middle

INN alanı (10 veya 12 rakam). Blur sonrası hata göster. Gönder düğmesi, form geçerli değilse devre dışı kalır.

sobes.tech yapay zeka

AI'dan gelen yanıt

10 veya 12 haneli doğrulama, blur sonrası hata gösterimi ve form geçersizken "Gönder" düğmesini devre dışı bırakma özelliklerine sahip INN alanı için şu şekilde yapabilirsiniz (React'te):

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 10 veya 12 haneli olmalı</div>
      )}
      <button type="submit" disabled={!isValid}>Gönder</button>
    </form>
  );
}

export default InnForm;
```\n\nBurada:\n- Doğrulama, INN'in tam olarak 10 veya 12 hane olup olmadığını kontrol eder.\n- Hata, sadece alan kaybedildikten sonra (`blur`) gösterilir.\n- "Gönder" düğmesi, INN geçerli değilse devre dışıdır.