How to send variable to php with ajax?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
    <script type="text/javascript">
    function load(thediv, thefile)
    {
        if (window.XMLHttpRequest)
        {
        xmlhttp = new XMLHttpRequest(); 
        }
            else
            {
            xmlhttp = new ActiveXObject('Microsoft.XMLHTTP)');  
            }

                xmlhttp.onreadystatechange = function()
                {
                    if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                    document.getElementById(thediv) .innerHTML = xmlhttp.responseText;  
                    }
                }

                xmlhttp.open('GET', thefile, true);
                xmlhttp.send();

    }
    </script>
</head>

    <body>

<?php 

//connection to db and mysql query


    $result = mysql_query($query) or die(mysql_error());

$options=""; 

while ($row=mysql_fetch_array($result)) { 

$id=$row["idProducts"]; 
$thing=$row["country"]; 
$options.="<OPTION VALUE=\"$id\">".$thing.'</option>'; 
}
mysql_close();
?> 


<SELECT id="countrySearch" NAME=countrySearch onchange="load('divtest',   'step2.search.php')";>
<OPTION VALUE=0>Choose 
<?=$options?> 
</SELECT> 

<div id="divtest">
test
</div>

</body>

step2.search.php consists of:

<?php
echo "I want it to store the users selection as a variable for php to use";
?>

The problem I have is I want to store what the user selects from the drop down box and use it in php to do a mysql query using the variable from the user select form to form the WHERE part of the mysql statement. Then use ajax to put new data in "divtest".

How can I store the user selection into a variable then send it to be used in step2.search.php?

Answers


See Code Below

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
    <script type="text/javascript">
    function load(thediv, thefile,selectvalue)
    {
        if (window.XMLHttpRequest)
        {
        xmlhttp = new XMLHttpRequest(); 
        }
            else
            {
            xmlhttp = new ActiveXObject('Microsoft.XMLHTTP)');  
            }

                xmlhttp.onreadystatechange = function()
                {
                    if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                    document.getElementById(thediv) .innerHTML = xmlhttp.responseText;  
                    }
                }


                xmlhttp.open("GET",thefile+"?q="+selectvalue,true);
                xmlhttp.send();

    }
    </script>
</head>

    <body>
    <form>

<?php 

//connection to db and mysql query


    $result = mysql_query($query) or die(mysql_error());

$options=""; 

while ($row=mysql_fetch_array($result)) { 

$id=$row["idProducts"]; 
$thing=$row["country"]; 
$options.="<OPTION VALUE=\"$id\">".$thing.'</option>'; 
}
mysql_close();
?> 


<SELECT id="countrySearch" NAME=countrySearch onchange="load('divtest',   'step2.search.php', this.value)";>
<OPTION VALUE=0>Choose 
<?=$options?> 
</SELECT> 

<div id="divtest">
test
</div>
</form>

step2.search.php

<?php
    Simple grab this variable
    $id = $_GET['q'];

    //do your query stuffhere
?>

Need Your Help

Flex 3 - Using error tooltips as normal ones

flex validation tooltip

I'd like to use tooltips with the same design as the error/validation tooltips (rounded box with a tip pointing to the mouse's position).

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.