By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,481 Members | 1,199 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,481 IT Pros & Developers. It's quick & easy.

Variables moving javascript ->ajax ->php -> sql

P: 3
I am trying to write a script where a page is populated with some maths questions, user answers them (it's timed but I've left this bit out), gets results on same page and ajax takes their score, sends it to php script which updates sql. Make sense so far?!!

The problem I have is getting their score out of javascript and into ajax and therefore into the sql record table. I have no problem sending php variables to ajax, just the javascript one.

The code :

Expand|Select|Wrap|Line Numbers
  1. <HTML><HEAD>
  2. <?PHP
  3. //info carried forward from previous page:
  4.  
  5. $test_name = "strawberry1";
  6. $person = "name";
  7.  
  8. ?>
  9.  
  10. <script type="text/javascript">
  11. <!--
  12. function writeResults(){
  13.     var ajaxRequest;  // The variable that makes Ajax possible!
  14.     try{
  15.         // Opera 8.0+, Firefox, Safari
  16.         ajaxRequest = new XMLHttpRequest();
  17.     } catch (e){
  18.         // Internet Explorer Browsers
  19.         try{
  20.             ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
  21.         } catch (e) {
  22.             try{
  23.                 ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
  24.             } catch (e){
  25. // Something went wrong
  26. alert("Your browser broke!");
  27. return false;
  28.             }
  29.         }
  30.     }
  31.     // Create a function that will receive data sent from the server
  32.     ajaxRequest.onreadystatechange = function(){
  33.         if(ajaxRequest.readyState == 4){
  34.             var ajaxDisplay = document.getElementById('ajaxDiv');
  35.             ajaxDisplay.innerHTML = ajaxRequest.responseText;
  36.         }
  37.     }
  38. // get form variables
  39.     var CorrectAns = document.getElementById('CorrectAns').value;
  40.  
  41.     var queryString = "?CorrectAns=" + CorrectAns";    
  42.  
  43.     ajaxRequest.open("GET", "write-results.php" + queryString, true);
  44.     ajaxRequest.send(null); 
  45. }
  46.  
  47. function CheckAnswers(elm)
  48. {  
  49.   for(var i = 0; i < 3; i++)    // QQQ number of q's - get from sql for each test
  50.   {
  51.     var elm11 = document.getElementById("txt" + i);  // answer given by user
  52.     var elm12 = document.getElementById("ans" + i);  // correct answer
  53.     var elm13 = document.getElementById("atd" + i);  // area to put correct / wrong
  54.     if(elm11)
  55.     {
  56.     if(elm12.value == elm11.value)
  57.       {
  58.     correctAns++;
  59.       }
  60.       else
  61.       {
  62.     if(elm13 != null)
  63.     {
  64.      elm13.innerHTML = "answer = " + elm12.value;
  65.     }
  66.       }
  67.     }
  68.   }
  69. }
  70. -->
  71. </SCRIPT>
  72.  
  73. </HEAD>
  74.  
  75. <body>
  76. <FORM action="<?=$_SERVER['PHP_SELF']?>" method="post">
  77.  
  78. <table>
  79. <tr><td>6</td><td>+</td><td>1</td><td>=</td><td>?</td><td><input type="text" name="txt0" size="3"></td>
  80. <td></td><td></td><td><TD align="middle" width="40"><IMG id="img0" src="blank.gif"></TD><TD class="answers" id="atd0" vAlign="left" align="left" width="140">&nbsp;</td><TD><input type="hidden" name="ans0" value="7" width="40"><input type="hidden" name="qr" value="0"><input type="hidden" name="id" value="28"></td></tr>
  81.  
  82. <tr><td>3</td><td>+</td><td>4</td><td>=</td><td>?</td><td><input type="text" name="txt1" size="3"></td>
  83. <td></td><td></td><td><TD align="middle" width="40"><IMG id="img1" src="blank.gif"></TD><TD class="answers" id="atd1" vAlign="left" align="left" width="140">&nbsp;</td><TD><input type="hidden" name="ans1" value="7" width="40"><input type="hidden" name="qr" value="1"><input type="hidden" name="id" value="3"></td></tr>
  84.  
  85. <tr><td>3</td><td>+</td><td>2</td><td>=</td><td>?</td><td><input type="text" name="txt2" size="3"></td>
  86. <td></td><td></td><td><TD align="middle" width="40"><IMG id="img2" src="blank.gif"></TD><TD class="answers" id="atd2" vAlign="left" align="left" width="140">&nbsp;</td><TD><input type="hidden" name="ans2" value="5" width="40"><input type="hidden" name="qr" value="2"><input type="hidden" name="id" value="5"></td></tr>
  87. </TABLE>
  88.  
  89. <input type="hidden" id="CorrectAns" value="">
  90. <input  type=button value="Check Answers" name=Check Answers id=writeResults style="DISPLAY: none" onclick=CheckAnswers(); writeResults()> </td>
  91. <td width="50%"><INPUT class=bigbutton id=BtnSub style="DISPLAY: none" type=submit value="Start New Test"></center><!--<img src="COLSRCPtrans.gif"/></center>-->
  92. </td></tr></table></td></tr><tr><td>
  93. <div id="ajaxDiv">if this disappeared something happened with AJAX!!</div></td></tr>
  94.  
  95. </FORM>
  96. </BODY></HTML>
and the form receiving the ajax data and passing it through to the sql table is write-results.php:


[PHP]<?php
mysql_connect($dbhost, $dbuser, $dbpass);
mysql_select_db($dbname) or die("Cannot connect to database");

$CorrectAns = $_GET['CorrectAns'];
$test_name = $_GET['test_name '];
$person = $_GET['person'];

mysql_query("INSERT INTO person (id, test_name, num_correct, date_time)
VALUES ('', '$test_name', '$CorrectAns', NOW())");

?>[/PHP]

If I change the form field to
<input type="hidden" id="CorrectAns" value="666"> then 666 is written to the table fine.

So, I conclude, the problem lies with defining a value for 'CorrectAns' in function CheckAnswers(elm)....

Can anybody please show me the correct javascript to get the result 'correctAns' into the form and therefore back into the ajax?

Thanks
Sep 12 '08 #1
Share this Question
Share on Google+
5 Replies


Expert 100+
P: 392
At lest one of your problems is probably this extra quotes.

This line :
Expand|Select|Wrap|Line Numbers
  1. var queryString = "?CorrectAns=" + CorrectAns"
Should be :
Expand|Select|Wrap|Line Numbers
  1. var queryString = "?CorrectAns=" + CorrectAns; 
Sep 12 '08 #2

P: 3
Thanks for spotting that! Sadly that's only a typo in my post, the script doesn't have the extra ".
Sep 12 '08 #3

acoder
Expert Mod 15k+
P: 16,027
You've not set correctAns anywhere, so correctAns++ doesn't make sense. Set it to 0 to begin with.
Sep 13 '08 #4

P: 3
Looking at the script as a whole (rather than the edited one I've posted) it is set to zero by:

var correctAns = 0;
.....for(var i = 0; i < 3; i++) etc

However, is that the correct way to declare it?
Sep 14 '08 #5

acoder
Expert Mod 15k+
P: 16,027
Yes. To set the value of the hidden field, get the field by its ID as you have done in writeResults() (line 39) and set its value:
Expand|Select|Wrap|Line Numbers
  1. var CorrectAnsField = ...
  2. CorrectAnsField.value = correctAns;
Sep 14 '08 #6

Post your reply

Sign in to post your reply or Sign up for a free account.