Walidacja Formularza Javascript

0
`<form name="formularz" class="Rejestracja" method="post" onsubmit="return CheckForm(this)">
			<div>
			
				<label for="imie">Imię</label>	
				<input  type="text" name="user_imie" >
				
			
			</div>

```
Proszę o pomoc mam takie dane w formularzu i muszę je zwalidować w javascript ale nie chce walidować za pomoca alerta .Tylko jak ktoś nie wypełni tego pola to obok pola pojawi się czerwony napis. Czy ktoś mógłby pomóc.
0

możesz stworzyć span obok pola tekstowego i za pomocą innerHTML wstawić do tego spana tekst. Walidację możesz zrobić przez sprawdzenie długości napisu

0

Można to rozwiązać w ten sposób:

<form name="formularz" class="Rejestracja" method="post" onsubmit="return CheckForm(this)">
    <div>
		<label for="imie">Imie</label>  
        <input type="text" name="user_imie" id="userName" onkeyup="validateInput()">
		<span id="validationMessage" style="color: red;"></span>
	</div>
</form>
<script>
	validateInput();

	function validateInput() {
		var userName = document.getElementById('userName').value;
		var validationMessage = '';
		if (userName.length < 1) {
			validationMessage = 'Prosze wypelnic pole';
		} 	
		document.getElementById('validationMessage').innerHTML = validationMessage;
	}
</script>
0

Wstawiłem ten kawałek kodu jednak po kliknieciu na submit nic się nie dzieje

0

<div>
		<input type="submit" value="Zarejestruj się!" />
</div>

jak podpiąc tamten fragment pod tego submit?

0

Jeżeli chodzi o to, żeby czerwony napis pojawiał się po naciśnięciu na guzik to wystarczy powyższy kod wywołać w innym miejscu:

<!DOCTYPE html>
<html>
<body>

<form name="formularz" class="Rejestracja" action="/" onsubmit="checkForm()">
    <div>
		<label for="imie">Imie</label>  
        <input type="text" name="user_imie" id="userName">
		<span id="validationMessage" style="color: red;"></span>
	</div>
	<div>
		<input type="submit" value="Zarejestruj sie!" />
	</div>
</form>
	
<script>	
	function checkForm() {
		var userName = document.getElementById('userName').value;
		var validationMessage = '';
		if (userName.length < 1) {
			validationMessage = 'Prosze wypelnic pole';
		} 	
		document.getElementById('validationMessage').innerHTML = validationMessage;
	}		
</script>

</body>
</html>

Zarejestruj się i dołącz do największej społeczności programistów w Polsce.

Otrzymaj wsparcie, dziel się wiedzą i rozwijaj swoje umiejętności z najlepszymi.