Wysyłanie formularza bez przeładowania strony

A jak zrobić, żeby po wysłaniu takiego formularza nie przechodziło na nową stronę? 

++++

mam coś takiego:
 

<script type="text/javascript">
    $(function() {  
        $("#submit").click(function() {  
            var yourname = $('#yourName').val(); 
			var youremail = $('#yourEmail').val();
			var yourmessage = $('#messageText"').val();
			 
			$.ajax({  
			    type: 'POST',  
			    url: 'sendToFriend.php',
			    data: dataString,  
			    success: function(youremail) {
				// ????????????
			    }  
			});
        });  
    }); 
</script>

Jak przesłać te zmienne do pliku sendToFriend.php po to, żeby wysłać je za pomocą mail(); ?

W parametrze data wstawiasz

{name: yourname, email: youremail, message: yourmessage}

W parametrze data wstawiasz

{name: yourname, email: youremail, message: yourmessage}

tak?

$.ajax({  
  type: 'POST',  
  url: 'sendToFriend.php',
  data: {name: yourname, email: youremail, message: yourmessage},  
  success: function(data) {
    // ????????????
  } 
});

Nie czaję tego. Jak to potem odebrać w piku PHP. No i jak to poprawnie wysłać, bo to chyba źle jest co napisałem...

Wytłumaczę tak. To co jest przed dwukropkiem określa nazwę, tak samo jakbyś zastosował input z atrybutem name.

Czyli w PHP odbieramy to tak samo:

$_POST['name'] 

$_POST['email']

$_POST['message']

Wytłumaczę tak. To co jest przed dwukropkiem określa nazwę, tak samo jakbyś zastosował input z atrybutem name.

Czyli w PHP odbieramy to tak samo:

$_POST['name'] 

$_POST['email']

$_POST['message']

Ok, jasne, ostatnie pytanie.

Muszę to wysyłać w tej funckji:
 

success: function(data) {
    // ????????????
  }

czy wystarczy, że zdefiniuję te zmienne z dwukropkami,  a to success: całkowicie usunę?

metoda success odpowiada za to co będzie się działo po poprawnym wykonaniu skryptu.

Jeżeli w PHP zrobisz, np. echo "komunikat"; to zmienna data będzie zawierała "komunikat"

Możesz również przekazywać informacje z PHP do js w formacie JSON.

A jak zrobić, żeby po wysłaniu takiego formularza nie przechodziło na nową stronę? 

Używasz funkcji submit:

$('form').submit(function(e){
  e.preventDefault();
  //i tutaj cała reszta
})

Funkcja success to callback w razie powodzenia. Czyli jak skrypt nie wywali żadnego błędu to po całej akcji zostanie wywołana funkcja success (np wyświetli komunikat dziękujemy zapraszamy ponownie).

Używasz funkcji submit:

$('form').submit(function(e){
  e.preventDefault();
  //i tutaj cała reszta
})

Funkcja success to callback w razie powodzenia. Czyli jak skrypt nie wywali żadnego błędu to po całej akcji zostanie wywołana funkcja success (np wyświetli komunikat dziękujemy zapraszamy ponownie).

Ja wyczarowałem coś takiego na podstawie wcześniejszej dyskusii. Ma to sens? I dlaczego nie wyświetla żadnego alertu. #submit to id mojego przycisku do wysłania formularza.

<script type="text/javascript">
    $(function() {  
        $("#submit").click(function() {  
            var yourname = $('#yourName').val(); 
			var youremail = $('#yourEmail').val();
			var yourmessage = $('#messageText"').val();
			 
			$.ajax({  
			    type: 'POST',  
			    url: 'sendToFriend.php',
			    data: {name: yourname, email: youremail, message: yourmessage},
			    success: function(){
    				alert('success');
  				},
  				 error: function(){
    				alert('failure');
  				}
			});
        });  
    }); 
</script>

Bo może nie ma błędu, popatrz tutaj:

http://web-talk.pl/t...mularz-ajaxowy/

Bo może nie ma błędu, popatrz tutaj:

http://web-talk.pl/t...mularz-ajaxowy/

nie ma błędu i nie ma powodzenia? Kolega dla sukcesu też dał alert.

Jak nie będziesz robił z tego poradnika to spróbuj tak:

$.ajax({  
	type: 'POST',  
	url: 'sendToFriend.php',
	data: {name: yourname, email: youremail, message: yourmessage}
}).always(function(){
alert('test');
});

Zwróć uwagę że w jquery od wersji 1.8 z tego co kojarzę to  callbacki success / error zostały zastąpione przez done / fail (nie wiem czy to również dotyczy Twojego sposobu zapisu.

Jak używasz chrome to podczas testów wciśnij F12 i zobacz zakładkę Console. Jeżeli FF to zainstaluj sobie Firebug i zrób to samo.

+ Może wydzielić posty od posta ernesta z problemem?

Użytkownik unbreak edytował ten post 26 stycznia 2014 - 14:55