How do I send a variable declared in JavaScript to the server side PHP script so that I can perform a SQL query using that variable?

Question

This is my JavaScript code:

xmlhttp.onreadystatechange=function() 
{
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
    {
        for(i = 0; i < 5; i++)
        {
            var prikey = (i+1);
            //document.getElementById("demo").innerHTML = prikey;
            myFunction(xmlhttp.responseText);
        }
    }
}

xmlhttp.open("GET", url, true);
xmlhttp.send();

function myFunction(response) 
{
    //some code here
}

Now, I want to transfer prikey from this JavaScript file to the server-side PHP file.

The PHP code is

$conn = mysqli_connect("$host", "$username", "$password")or die("cannot connect"); 
mysqli_select_db($conn,"$db_name")or die("cannot select DB");

$sql="SELECT countries FROM $tbl_name";
$result=mysqli_query($conn,$sql);

I want to integrate the transferred prikey variable such that I will be able to query the database in the following way:

$sql="SELECT countries FROM $tbl_name where id=$prikey";

where $prikey is where I store the value gotten from the JavaScript file.

How do I accomplish this?

First of all where is the variable being passed in the javascript. You need to actually add it to the end of your GET Url. Such as ?id=primarykey then use $_GET['id'] to fetch it. Then add your where clause into your query with a binding param such as where id= :mykey and then use mysqli bindparam function to pass the $_GET value into that and just fetch results back and send back. — Asheliahut
– Asheliahut, Commented Apr 30, 2015 at 2:29

score 2 · Accepted Answer · 2015-04-30 18:27:40Z

2

You need to add the prikey as a parameter to the GET url.

Javascript:

// The request is inside of a function so that each 
// xmlhttp is a different object
function sendRequest(prikey) {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function () 
    {
        if (xmlhttp.readyState === 4) 
        {
            if (xmlhttp.status === 200 || xmlhttp.status === 304) 
            {
                myFunction(xmlhttp.responseText);
            }
        }
    };
    xmlhttp.open("GET", url + '?prikey=' + prikey, true);
    xmlhttp.send();
}
// Send the requests
for(i = 0; i < 5; i++)
{
    // Pass it the prikey
    sendRequest(i + 1);
}

function myFunction(response) 
{
    // Do stuff
}

And in your PHP code, get it through the $_GET array:

// Get the variable sent through the Ajax request
$prikey = $_GET['prikey'];

$conn = mysqli_connect("$host", "$username", "$password")or die("cannot connect"); 
mysqli_select_db($conn,"$db_name")or die("cannot select DB");

$sql = "SELECT countries FROM $tbl_name WHERE id = $prikey";
$result = mysqli_query($conn,$sql);

// echo the result so that your JavaScript code gets the response
// Again, ignore if you've already done this
echo $result;

edited Apr 30, 2015 at 18:27

answered Apr 30, 2015 at 2:34

user4698813

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

11 Comments

blocjager Over a year ago

Yes. So, the code should run in a way that the ajax call is executed 5 times (because the for loop is that long) and every time it is executed, the sql query should retrieve data corresponding to the $prikey value.

blocjager Over a year ago

Ok, I don't know what's going on with my code. Only the 5th value gets displayed. I checked the JS console; my code is just retrieving the 5th value and ignoring the first four. May be it's an issue with the "//some code here" part. Will debug and see. Thanks for the update, though.

user4698813 Over a year ago

Hmm, are all requests being sent? Check the network tab. Also, the new XMLHttpRequest() has to be inside of the loop, otherwise the requests cancel out. No problem.

blocjager Over a year ago

So here's what's happening. I am tracking the network log, and every request (from prikey 1 to 5) is being sent, but the Time column in the Network tab is logged as 'pending' and is updated to time taken to retrieve the data only after for loop is exited. And I guess, that is the reason why just the fifth request (because it is the latest) is being displayed. But I got what I needed, so thanks @Alfonso Garnett

user4698813 Over a year ago

I think it was a problem with the code I posted, sorry. The onreadystate function was being 'overwritten' by every new request in the loop, so only the last one would execute. It is now encapsulated within a function, so that each request is a different object and the onreadystate property doesn't get overwritten. This should now work. Also, notice that prikey is no longer a global variable. If you want to use that var elsewhere other than for the AJAX request, you can re-declare it as global (outside of the functions). Sorry for that. Good luck, and thanks to you.

|

Collectives™ on Stack Overflow

How do I send a variable declared in JavaScript to the server side PHP script so that I can perform a SQL query using that variable?

1 Answer 1

11 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

11 Comments

Your Answer

Sign up or log in

Post as a guest

Related