Javascript not passing variable to PHP with HTML form

Question

I have contact form, that uses Javascript and PHP.

My problem is that the javascript does not pass its variables to the PHP script. I have discovered the following:

The variables does get set in the javascript, as it passes the variable check inside the javascript and by using alerts showing the variable.

As it travels to the PHP script, the variables are no longer there. I have tried to comment out the check in the PHP script, then it succesfully send a mail, but the mail was empty apart from the static content from the PHP script.

I have tried various different methods, including passing the variables directly from the http.send() function.

Here is the relevant code (These are all 3 different files on the web server):

HTML:

div class="contact_form">
            <h4>Get in touch</h4>
            <form method="post">
                <input type="text" name="Name" id="name" value="Name" onfocus="this.value = this.value=='Name'?'':this.value;" onblur="this.value = this.value==''?'Name':this.value;" />
                <input type="text" name="Email" id="email" value="Email" onfocus="this.value = this.value=='Email'?'':this.value;" onblur="this.value = this.value==''?'Email':this.value;" />
                <input type="text" value="Subject (Hosting, Requests, Appeal, Report, etc.)" id="subject" onfocus="this.value = this.value=='Subject (Hosting, Requests, Appeal, Report, etc.)'?'':this.value;" onblur="this.value = this.value==''?'Subject (Hosting, Requests, Appeal, Report, etc.)':this.value;" />
                <textarea name="Message" id="body" onfocus="this.value = this.value=='Message'?'':this.value;" onblur="this.value = this.value==''?'Message':this.value;">Message</textarea>
                <input type="submit" name="submit" id="submit" value="send" class="submit-button" onClick="return check_values();" />
            </form>
            <div id="confirmation" style="display:none; position: relative; z-index: 600; font-family: 'Open Sans', sans-serif; font-weight: 300; font-size: 16px; color: #4e4e4e;"></div>
        </div> <!-- end .contact_form -->

Javascript:

var http = createRequestObject();
var areal = Math.random() + "";
var real = areal.substring(2,6);

function createRequestObject() {
    var xmlhttp;
    try { xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); }
  catch(e) {
    try { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}
    catch(f) { xmlhttp=null; }
  }
  if(!xmlhttp&&typeof XMLHttpRequest!="undefined") {
    xmlhttp=new XMLHttpRequest();
  }
    return  xmlhttp;
}

function sendRequest() {
    var rnd = Math.random();
    var name = escape(document.getElementById("name").value);
    var email = escape(document.getElementById("email").value);
    var subject = escape(document.getElementById("subject").value);
    var body = escape(document.getElementById("body").value);

    try{
        http.open('POST','pform.php');
        http.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        http.send('name='+name+'&email='+email+'&subject='+subject+'&body='+body+'&rnd='+rnd);
        http.onreadystatechange = handleResponse;
    }
    catch(e){}
    finally{}
}

function check_values() {
    var valid = '';

    var name = document.getElementById("name").value;
    var email = document.getElementById("email").value;
    var subject = document.getElementById("subject").value;
    var body = document.getElementById("body").value;
    if(trim(name) == "" ||
        trim(email) == "" ||
        trim(subject) == "" ||
        trim(body) == "") {
            alert("Please complete all fields");
    } else {
        if(isEmail(email)) {
            document.getElementById("submit").disabled=true;
            document.getElementById("submit").value='Please Wait..';
            sendRequest();
        } else {
            alert("Email appears to be invalid\nPlease check and try again");
            document.getElementById("email").focus();
            document.getElementById("email").select();
        }
    }
}

function handleResponse() {
    try{
    if((http.readyState == 4)&&(http.status == 200)){
        var response = http.responseText;
      document.getElementById("confirmation").innerHTML = response;
      document.getElementById("confirmation").style.display ="";
        }
  }
    catch(e){}
    finally{}
}

function isUndefined(a) {
   return typeof a == 'undefined';
}

function trim(a) {
    return a.replace(/^s*(S*(s+S+)*)s*$/, "$1");
}

function isEmail(a) {
   return (a.indexOf(".") > 0) && (a.indexOf("@") > 0);
}

PHP:

<?php
error_reporting(0);

$page_title = "Contact Us Form";
$email_it_to = "[email protected]";
$error_message = "Please complete the form first";
$confirmation = "Thank you, your message has been successfully sent.";

if(!isset($rnd) || !isset($name) || !isset($email) || !isset($subject) || !isset($body)) {
    echo $error_message;
    die();
}

    $email_from = $email;
    $email_subject = "Contact Form: ".stripslashes($subject);
    $email_message = "Please find below a message submitted by '".stripslashes($name);
    $email_message .="' on ".date("d/m/Y")." at ".date("H:i")."\n\n";
    $email_message .= stripslashes($body);

    $headers = 'From: '.$email_from."\r\n" .
   'Reply-To: '.$email_from."\r\n" .
   'X-Mailer: PHP/' . phpversion();

    mail($email_it_to, $email_subject, $email_message, $headers);

    echo "<b>$confirmation</b>";
    die();
?>

On the PHP script, you have to retrieve you data from $_POST as your AJAX call is POSTING data. in your PHP you are using directly your vars. who has initialized them .? — MatRt
– MatRt, Commented Apr 11, 2013 at 22:37

Drew · Accepted Answer · 2013-04-11 22:37:42Z

1

You're not using the $_POST variable to grab anything - you're using unset variables.

Change all your calls to use $_POST:

if(!isset($rnd) || !isset($name) || !isset($email) || !isset($subject) || !isset($body))

Change to:

if(!isset($_POST['rnd']) || !isset($_POST['name']) || !isset($_POST['email']) || !isset($_POST['subject']) || !isset($_POST['body']))

And you'll need to change it anywhere else you're using the undefined variables.

Alternatively, you could just do:

$rnd = mysql_real_escape_string($_POST['rnd']);
$name = mysql_real_escape_string($_POST['name']);
... and so on

answered Apr 11, 2013 at 22:37

Drew

4572 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Digitalis Over a year ago

I'd use a loop to iterate through $_POST, other than that, +1

Thomas Schmidt Over a year ago

Thank you very much, it solved my problem, by replacing $name with $_POST['name'] etc.!

Tony · Accepted Answer · 2013-04-11 22:36:58Z

0

Try this:

try{
    http.open('POST','pform.php?name='+name+'&email='+email+'&subject='+subject+'&body='+body+'&rnd='+rnd);
    http.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    http.onreadystatechange = handleResponse;
}

answered Apr 11, 2013 at 22:36

Tony

7514 silver badges9 bronze badges

Comments

Steven Bennett · Accepted Answer · 2013-04-11 22:45:12Z

0

Use $_POST to access POST variables:

if (!isset($_POST["my_post_variable"]) {
 die('No post arguments passed.');
}

answered Apr 11, 2013 at 22:45

Steven Bennett

961 silver badge1 bronze badge

Comments

Shripal Gandhi · Accepted Answer · 2013-04-11 22:53:54Z

0

Its because Javascript is client-side scripting language, and PHP is a server side. So cannot directly access variables of javascript through PHP.

You can access the values posted by the HTML form as

<?php
$var_name = $_POST['name_of_the_variable_to_access'];
//then access these variables in your code.
?>

You can also try this one line code at the starting of your php script, but you need to make sure that the variable value is not re-assigned in your php code.

<?
extract($_POST);
//your code here.
?>

Using above code you will get the HTML Page values in variables - $Name, $Email, $Message.

And ya, you need to give name to Message field. It would be a good practice to write name in lower case only

edited Apr 11, 2013 at 22:53

answered Apr 11, 2013 at 22:47

Shripal Gandhi

1262 silver badges10 bronze badges

Collectives™ on Stack Overflow

Javascript not passing variable to PHP with HTML form

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related