Middle
INN դաշտ (10 կամ 12 թվեր): Բլուրից հետո սխալ ցույց տալ: Ուղարկման կոճակը անջատված է, մինչև ձևը վավեր լինի։
sobes.tech AI
Պատասխան AI-ից
10 կամ 12 թվերից բաղկացած վավերացման դաշտի համար, սխալի ցուցադրում blur հետո և «Ուղարկել» կոճակն անջատված մինչև ֆորման չլինի վավեր, կարող եք անել այսպես (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 պետք է պարունակի 10 կամ 12 թիվ</div>
)}
<button type="submit" disabled={!isValid}>Ուղարկել</button>
</form>
);
}
export default InnForm;
```\n\nԱյստեղ՝\n- Վավերացումը ստուգում է, որ INN-ը պարունակում է ճիշտ 10 կամ 12 թիվ։\n- Խնդիրը ցուցադրվում է միայն այն ժամանակ, երբ դաշտը կորցնում է ֆոկուսը (`blur`)։\n- «Ուղարկել» կոճակը անջատված է, քանի դեռ INN-ը չի վավերական։