CODEWITHSUNDEEP
phpjavascript
Lavinia
Lavinia

Reputation: 263

problems passing a php variable into JavaScript

I want to pass a php variable into JavaScript. I have to get from a database the questions(randomly, one by one) and if the end user responses correctly, the program is doing something else.

database

+------+-----------------------+---------------+-----------------+
| q_id | description           | text          | answer          |
+------+-----------------------+---------------+-----------------+
|    1 |What is the capital    | United States | Washington D.C. |
|    2 |What is the capital    | California    | Sacramento      |
|    3 |What is the capital    | Maryland      | Annapolis       |
+------+-----------------------+---------------+-----------------+

In the php file, variables $question and $correctAnswer have the following values:

php code:

$sql="SELECT description, text, answer  FROM Questions";
$result = mysql_query($sql);
while($row = mysql_fetch_array($result))
{
   $question=$row['description']."of ".$row['text']."?";
   echo($question);
   $correctAnswer=$row['answer'];
   //echo($correctAnswer);
}

javascript code:

var rightAnswer;
function takeQuestion()
{
    var xmlhttp;    
    if (window.XMLHttpRequest)
    {
        xmlhttp=new XMLHttpRequest();
    }
    else
    {
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
           document.getElementById("question").innerHTML=xmlhttp.responseText;
           rightAnswer ='<?php echo $correctAnswer;?>';
           alert(rightAnswer); 
        }
    }
    xmlhttp.open("GET","getQuestion.php",true);
    xmlhttp.send();
 }

The program is printing randomly the questions, but I have problems passing the variable $correctAnswer to Javascript. Variable rightAnswer in JavasScript should take the value of php variable $correctAnswer. Any help will be appreciated. Thank you in advance!

Upvotes: 2

Views: 295

Answers (3)

Vikas Umrao
Vikas Umrao

Reputation: 2615

Change Your javascript as:

Call it as responseXml:

<script type="text/javascript">
var rightAnswer;
function takeQuestion()
{
    var xmlhttp;    
    if (window.XMLHttpRequest)
    {
        xmlhttp=new XMLHttpRequest();
    }
    else
    {
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
           xmlDoc=xmlhttp.responseXML; 
           document.getElementById("question").innerHTML=xmlDoc.getElementsByTagName('question')[0].firstChild.nodeValue;
           rightAnswer =xmlDoc.getElementsByTagName('answer')[0].firstChild.nodeValue;
           alert(rightAnswer); 
        }
    }
    xmlhttp.open("GET","getQuestion.php",true);
    xmlhttp.send();
 }

 </script>

Change Your php file as:

<?php
 header('Content-Type: text/xml');
 header ('Cache-Control: no-cache');
 header ('Cache-Control: no-store' , false);     // false => this header not override the previous similar header

$sql="SELECT description, text, answer  FROM Questions";
$result = mysql_query($sql);
while($row = mysql_fetch_array($result))
{
   $question=$row['description']."of ".$row['text']."?";
   //echo($question);
   $correctAnswer=$row['answer'];
   //echo($correctAnswer);
} 


$xmlStr='<?xml version="1.0" encoding="UTF-8"?>
<data>
   <question>'.$question.'</question>
   <answer>'.$correctAnswer.'</answer>
</data>
';
echo $xmlStr;
?>

Upvotes: 1

someone
someone

Reputation: 6572

In your PHP inside while loop do this

$question=$row['description']."of ".$row['text']."?|".$row['answer'];
echo($question);

in your java script

if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        var elements = xmlhttp.responseText.split("|");
       document.getElementById("question").innerHTML=elements[0];
       var rightAnswer = elements[1];
       alert(rightAnswer); 
    }

This is an idea. Change it to way that you want.

Upvotes: 2

galchen
galchen

Reputation: 5290

when you have Javascript and PHP on the same page, then you can pass data to the javascript using json_encode:

<?php
$var = 'hello';
?>
<script type="text/javascript">
var v = <?= json_encode($var); ?>;
</script>

without quotes

if you make an ajax call - the variable is not passed through the PHP, but as an http request. You use plain JS in that case

Upvotes: 0

Related Questions