Przesłanie danych do formularza przez AJAX

Question

Witam,

 

W jaki sposób przesłać dane formularza do pliku PHP za pomocą AJAX?

Kod JS:

$(function() {
     $(".submit").click(function() {
       var login = $('#first-name').val();
var password = $('#last-name').val();
var dataString = 'login='+ login + '&password=' + password;

$.ajax({
  type: 'POST',
  url: 'http://bakr-test.esy.es/szansa/contact-form.php',
  data: dataString,
  success: function(data) {
      if( data == '0' )
          alert( 'Błędne dane logowania!!!' );
      else
          window.location = window.location;
  }
});
     });
 });

Kod PHP

<?php

$name = $_POST['first-name'];

$lastname = $_POST['last-name'];

$email = $_POST['e-mail'];

$message = $_POST['message'];

$odkogo = "bartlomiej.krakowski@interia.eu";

$dokogo = "bartlomiej.krakowski@interia.eu";

$tytul = "Formularz kontaktowy z 79level.pl";

$wiadomosc = "";
$wiadomosc .= "Imie: " . $name . "\n";
$wiadomosc .= "Nazwisko: " . $lastname . "\n";
$wiadomosc .= "Email: " . $email . "\n";
$wiadomosc .= "Wiadomość: " . $message . "\n";

$sukces = mail($dokogo, $tytul, $wiadomosc, "Od: <$odkogo>");

if ($sukces){
  print "http://onet.pl";
}
else{
  print "<meta http-equiv=\"refresh\" content=\"0;URL=error.html\">";
}
?>

 

Answer 1

Ale ty "postem" ślesz tylko login i hasło (patrz: zmienna dataString). Musisz przesłać również pozostałe dane, które potem chcesz odbierać w PHP.

A tak na marginesie:

var password = $('#last-name').val();

przemyśl nazewnictwo ID w HTML. Na pewno za rok będziesz w stanie wyjaśnić co ma wspólnego "nazwisko" z "hasłem" ? :)

Nie wiem jaki masz kod HTML, ale jeśli element  klasą "submit" to input type="submit" to nie musisz bawić się w zdarzenie click tylko po prostu przechwyć zdarzenie submit formularza i w razie potrzeby zastosuj preventDefault() aby zapobiec faktycznemu wysłaniu formularza. Możesz np. poczekać na odpowiedź serwera i w zależności od niej odpowiednio zmodyfikować stronę (bez przeładowywania). Na co dzień rzadko korzystam z jQuery ale w "komunikacji" z serwerem istnieje zdarzenie onerror, i z tego co pamiętam w jQuery to chyba mógłbyś zrobić poprzez przypisanie odpowiedniej funkcji zwrotnej do metody "error" (tak jak robisz z "success") - ale tutaj niech się może lepiej wypowie ktoś, kto więcej działa z jQuery.

if( data == '0' )

Bardzo ryzykowne porównanie... poczytaj w wolnej chwili o różnicy między "==" oraz "===" a zrozumiesz o czym mówię.

 

I tak w ogóle to przesyłając dane do serwerka polecam zaprzyjaźnić się z odpowiednimi metodami ich zabezpieczenia, np. encodeURIComponent. I co ważniejsze, obowiązkowo walidacja danych na serwerze. Ja na co dzień jeśli potrzebuję PHP to używam CodeIgnitera + dodatkowa własna biblioteka RegExp ale czysty PHP też ma funkcje walidujące, chyba filter_var() się to nazywało.