Please, help me get $randomQ and $matchinA, then have jQuery refresh if $matchinA is typed?

Question

Please, show me how to get a random question, '$randomQuestion'(i.e., "What color is the sky?"), and matching answer, $matchingAnswer, from the quizID section of my SQL database, and then use jQuery to refresh the form, only? I started by creating the form and some JavaScript that may work.

FORM:

<form name="$quizID" action="http://asite.com" method="post">
  <fieldset>
    <legend="$randomQuestion">
    <p>
      <label>Answer: <input type="text" id="answer" onkeydown="submitAns(submit.id)" /></label>
    </p>
  </fieldset>
</form>

JS:

function submitAns(id) {
  if (document.getElementById(id).value=="$matchingAnswer")
          document.a.submit();
}

JQUERY:

$.post('get-question_matchinganswer_for_quizID.php', {
  quizID: $quizID,
  question },
  function(data) {
    alert('Question is: ' + data.question)
    alert('Answer is: ' + data.answer)
  },
  'json'
);

PHP:

<!-- Help -->
function random_row($table, $column) {
  $max_sql = "SELECT max(" . $column . ") 
          AS max_id
          FROM " . $table;
  $max_row = mysql_fetch_array(mysql_query($max_sql));
  $random_number = mt_rand(1, $max_row['max_id']);
  $random_sql = "SELECT * FROM " . $table . "
          WHERE " . $column . " >= " . $random_number . " 
          ORDER BY " . $column . " ASC
          LIMIT 1";
  $random_row = mysql_fetch_row(mysql_query($random_sql));
  if (!is_array($random_row)) {
    $random_sql = "SELECT * FROM " . $table . "
            WHERE " . $column . " < " . $random_number . " 
            ORDER BY " . $column . " DESC
            LIMIT 1";

    $random_row = mysql_fetch_row(mysql_query($random_sql));
  }
  return $random_row;
}

$randomQuestion =
$matchinAnswer =

This is extremely complicated for me, and I've been having a world of trouble with it. PLEASE, comment. Thank you.

Answer 1

Well to start with, your HTML is invalid: You're not closing your tags:

<form name="$quizID" action="http://asite.com" method="post">
    <fieldset>
        <legend><?php echo $randomQuestion?></legend>
        <label>
            Answer: <input type="text" id="answer"
                           onkeydown="submitAns(submit.id)" />
        </label>
    </fieldset>
</form>

As for the ajax, I would suggest using jQuery. It makes things much easier.

$.post('getqidqandanswer.php', {
    quizID: 1337,
    questionID: 42},
    function(data) {
        alert('Question is: ' + data.question)
        alert('Answer is: ' + data.answer)
    },
    'json'
);

PHP:

$quizID = isset($_POST['quizID']) ? $_POST['quizID'] : null
$questionID = isset($_POST['questionID']) ? $_POST['questionID'] : null

if($quizID && $questionID)
{
   $data = getQuestionData($quizID, $questionID)
}
elseif($quizID)
{
   $data = getRandomQuestionData($quizID)
}
else
{
    $data = array(
        'question' => '',
        'answer'   => ''
    )
}

echo json_encode($data)

Answer 2

Are you sure AJAX is what you're looking for? Are the question and answer going to change within an instance of the page, or are they determined on the first load of the page?