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

pytanie zadane 7 grudnia 2015 w JavaScript przez artimal Gaduła (4,800 p.)

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ć?

2 odpowiedzi

odpowiedź 7 grudnia 2015 przez Szymon Lisowiec Mądrala (7,150 p.)

<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>

komentarz 7 grudnia 2015 przez artimal Gaduła (4,800 p.)

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

komentarz 7 grudnia 2015 przez Szymon Lisowiec Mądrala (7,150 p.)

A zapomniałem, w znaczniku form dodaj:

action="zarejestruj.php"

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

komentarz 7 grudnia 2015 przez artimal Gaduła (4,800 p.)

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

komentarz 7 grudnia 2015 przez Szymon Lisowiec Mądrala (7,150 p.)

Daj link, czy coś.

komentarz 7 grudnia 2015 przez artimal Gaduła (4,800 p.)

W tym temacie konwersacja z Tomatosoup ;D

odpowiedź 7 grudnia 2015 przez Tomatosoup Pasjonat (18,530 p.)

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

komentarz 7 grudnia 2015 przez artimal Gaduła (4,800 p.)

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

komentarz 7 grudnia 2015 przez Tomatosoup Pasjonat (18,530 p.)

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.

komentarz 7 grudnia 2015 przez artimal Gaduła (4,800 p.)

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

komentarz 7 grudnia 2015 przez Tomatosoup Pasjonat (18,530 p.)

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

komentarz 7 grudnia 2015 przez artimal Gaduła (4,800 p.)

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;
        }
    }

komentarz 7 grudnia 2015 przez Tomatosoup Pasjonat (18,530 p.)

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

komentarz 7 grudnia 2015 przez artimal Gaduła (4,800 p.)

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?