Lemmy
Lemmy

Reputation: 319

Ajax. Sending data to php file

Good day, I'm trying to use Ajax in my web application. But I have a little problem with it. I try to control a form if some username has already been registered or not. But my JavaScript seem does not send $_POST value to PHP. And responses that user in not defined on the line where I have $_POST['user'].

Here what I have.

PHP:

<?php
$opt = array(PDO::MYSQL_ATTR_INIT_COMMAND => 'SET NAMES utf8'); 
$dsn ='mysql:dbname=someone;host=127.0.0.1;charset=utf8';
$user='someone';
$pswd='aaa';

$dbh = new PDO($dsn, $user, $pswd, $opt);
$query="SELECT 1 FROM users WHERE  username = :username";   
        $query_p=array(':username' => $_POST['user']); 

        try 
        { 
            $statment = $dbh->prepare($query); 
            $result = $statment->execute($query_p); 
        }catch(PDOException $e) 
        {
            echo "Can't run query: " . $e->getMessage();        
     } 
        $row = $statment->fetch();
        if($row){           
        return 0;
        }else {
        return 1;
        }
?>

So it opens a connection to database and runs a query

JavaScript:

function checkUser(e){
    var state1 = document.getElementById("alert_text");
    var u = document.getElementById("user").value;
    if(u != ""){

        state1.innerHTML = 'processing...';
        var request = new XMLHttpRequest();

        request.open("POST", "validation.php", true);
        request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
         request.onreadystatechange = function() {
    if (request.readyState == 4 && request.status == 200) {
    var result=request.responseText;
alert(result);
   if(result==1){
        state1.innerHTML="OK";
    }else{
        state1.innerHTML="Alredy exists!";
    }
    }
  };
        request.send(u);
        var slova = request.responseText;
        }
}
document.getElementById("user").addEventListener("blur",checkUser,false );

So technically it is ajax.

HTML:

<form id="check"  name="signUp" method="post">
 <p class="alert_text"></p>
   <label for="user">Username:</label><br />

   <input id="user" name="user"  type="text" ><br />

</form>

I don't really see what's the problem...

Upvotes: 0

Views: 82

Answers (2)

jeroen
jeroen

Reputation: 91734

Based on the edited question: You are not sending any key-value pairs to the server, just a single value.

You need to change:

var u = document.getElementById("user").value;

to:

var u = 'user=' + encodeURIComponent(document.getElementById("user").value);

And then later on the pair will be sent correctly:

request.send(u);    // sends a single key-value pair

Note that I have just added the encodeURIComponent function to make sure the value gets encoded correctly.

Upvotes: 3

Matt Andrews
Matt Andrews

Reputation: 2878

You're not passing the username into the PHP script. Your PHP is looking for a POST variable, $_POST['user'] – in your JavaScript you make a GET request, so the PHP script has nothing to look up.

Upvotes: 4

Related Questions