Przycisk SUBMIT niech działa tylko po spełnieniu warunków.

Question

Cześć, przeprowadzam wstępną walidację w javascript i chciałbym żeby po kliknięciu w formularzu na przycisk submit dane formularza zostały przekazane do pliku.php jedynie gdy spełnią się odpowiednie warunki (od nośnie np. długości loginu itp.). Jak tego dokonać?

Answer 1

<form id="formularz"  method="post">
   <input type="text" name="poletekstowe" />
   <button>Wyślij</button>
</form>

<script>
var myform = document.getElementById('formularz');
var error = false;

myform.addEventListener('submit', function(){
   
   //Przykładowa walidacja:
   if(myform.elements['poletekstowe'].value.length == 0) error = true;
   
   if(error == true) return false; //zatrzymanie
}):
</script>

 

Comments

Tylko skąd ten kod ma wiedzieć, żeby przejść do pliku zarejestruj.php?

---

A zapomniałem, w znaczniku form dodaj:

action="zarejestruj.php"

<form id="formularz" action="zarejestruj.php"  method="post">

 

---

Zobacz na mój poprzedni post, wiesz może w czym leży problem? :)

---

Daj link, czy coś.

---

W tym temacie konwersacja z  Tomatosoup ;D

Answer 2

<form method="POST" onsubmit="return validateForm()">
<script>
	function validateForm() {
		if ( twoj_warunek ) {
			return true;
		}
		else {
			return false;
		}
	}
</script>

 

Comments

Skąd ten kod ma wiedzieć, żeby przkeazać dane do pliku zarejestruj.php?

---

Ten skrypt nic nie wie o przekazywaniu do pliku .php - ten kod to jest strażnik, który czuwa czy są spełnione podane warunki, jeżeli są - zwraca true a wtedy zostaje formularz przesłany metodą POST. Nic więcej w tym kodzie nie jest potrzebne.

---

Ale właśnie tak chcę zrobić, by wysyłać to do zarejestruj.php jeżeli spełnione sa warunki...

---

Jeżeli funkcja validateForm() zwróci true, czyli wtedy gdy zostaną spełnione warunki to dane zostaną przekazane do zarejestruj.php

---

Niestety ale mimo nie spełnienia warunków formularz został wysłany do zarejestruj.php
Oto mój warunek:

	function validateForm2() {
        if ($('#rej_login').val().length < 3 || $('#rej_login').val().length > 20 || $('#rej_haslo').val().length < 8 || $('#rej_haslo').val().length > 30 || $('#rej_haslo').val() != $('#rej_haslodwa').val() || $('#rej_email').val().length < 1 || !re.test($('#rej_email').val()) || $('#rej_email').val().length > 50) {
            return false;
        }
        else {
            return true;
        }
    }

 

---

Powinno być na odwrót:

function validateForm2() {
    if ($('#rej_login').val().length < 3 || $('#rej_login').val().length > 20 || $('#rej_haslo').val().length < 8 || $('#rej_haslo').val().length > 30 || $('#rej_haslo').val() != $('#rej_haslodwa').val() || $('#rej_email').val().length < 1 || !re.test($('#rej_email').val()) || $('#rej_email').val().length > 50) {
        return true;
    }
    else {
        return false;
    }
}

Zwrócenie wartości true jest tutaj równoznaczne z wysłaniem formularza, czyli:

Jeżeli <twoje warunki> to:

wyślij formularz

W przeciwnym wypadku

zwróć false, czyli nie wysyłaj formularza

---

Moje warunki są spełnione gdy dane są NIEWAŁŚCIWE :) Np. pierwszy warunek: login < 3 jest spełniony kiedy login jest niewłaściwy więc powinien if zwracać false?

---

Niestety ta walidacja nie działa.

---

Problem stanowi chyba:

!re.test($('#rej_email').val())

gdyż nigdzie prędzej nie masz ustalonej zmiennej re.

---

Jest ustawiona tylko o tym nie napisałem:) Już sobie poradziłem, dzięki za pomoc.