Serializing and submitting a form with jQuery and PHP

Question

I'm trying to send a form's data using jQuery. However, data does not reach the server. Can you please tell me what I'm doing wrong?

My HTML form:

<form id="contactForm" name="contactForm" method="post">     <input type="text" name="nume" size="40" placeholder="Nume">     <input type="text" name="telefon" size="40" placeholder="Telefon">     <input type="text" name="email" size="40" placeholder="Email">     <textarea name="comentarii" cols="36" rows="5" placeholder="Message"></textarea>      <input id="submitBtn" type="submit" name="submit" value="Trimite"> </form> 

JavaScript (in the same file as the above form):

<script type="text/javascript">     $(document).ready(function(e) {          $("#contactForm").submit(function() {             $.post("getcontact.php", $("#contactForm").serialize())             // Serialization looks good: name=textInNameInput&&telefon=textInPhoneInput etc             .done(function(data) {                 if (data.trim().length > 0) {                     $("#sent").text("Error");                    } else {                     $("#sent").text("Success");                 }             });              return false;         })     }); </script> 

Server side PHP (/getcontact.php):

$nume = $_REQUEST["nume"]; // $nume contains no data. Also tried $_POST $email = $_REQUEST["email"]; $telefon = $_REQUEST["telefon"]; $comentarii = $_REQUEST["comentarii"]; 

Can you please tell me what I am doing wrong?

---

UPDATE

Checked var_dump($_POST) and it returned an empty array.

The weird thing is that the same code tested on my local machine works fine. If I upload the files on my hosting space it stops working. I tried doing an old-fashioned form without using jQuery and all data was correct.

I don't see how this would be a server configuration problem. Any ideas?

Thank you!

Answer 1

You can use this function

var datastring = $("#contactForm").serialize(); $.ajax({     type: "POST",     url: "your url.php",     data: datastring,     dataType: "json",     success: function(data) {         //var obj = jQuery.parseJSON(data); if the dataType is not specified as json uncomment this         // do what ever you want with the server response     },     error: function() {         alert('error handling here');     } }); 

return type is json

EDIT: I use event.preventDefault to prevent the browser getting submitted in such scenarios.

Adding more data to the answer.

dataType: "jsonp" if it is a cross-domain call.

beforeSend: // this is a pre-request call back function

complete: // a function to be called after the request ends.so code that has to be executed regardless of success or error can go here

async: // by default, all requests are sent asynchronously

cache: // by default true. If set to false, it will force requested pages not to be cached by the browser.

Find the official page here