Question

I keep getting an unexpected character error in the console for the line

var a = JSON.parse(xmlhttp.responseText);

and I’m not sure why. Could this be why my textboxes aren’t populating with the parsed data?

Main page code:

function loadDoc()
{
   var xmlhttp;

   // code for IE7+, Firefox, Chrome, Opera, Safari
   if (window.XMLHttpRequest)
   {
      xmlhttp=new XMLHttpRequest();
   }
   // code for IE6, IE5
   else
   {
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }

   xmlhttp.onreadystatechange=function()
   {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
      {
         var doc = window.document.createElement("doc");
         var a = JSON.parse(xmlhttp.responseText);
         document.getElementById("textbox").innerHTML=a.first;
         document.getElementById("textbox2").innerHTML=a.second;
      }
   }

   xmlhttp.open("GET","loadTextBox.php?id=4",true);
   xmlhttp.send();
}

loadTextBox.php code:

<?php
---Placeholder for correct DB login info---

$result = $mysql->query(---Placeholder for correct SQL query---);

while ($row = $result->fetch_object())
{
   $queryResult[] = $row->present_tense;
}
$textboxValue = $queryResult[0];
$textboxValue2 = $queryResult[2];
echo json_encode(array('first'=>$textboxValue,'second'=>$textboxValue2));
?>

Answer 1

Your loadTextBox.php file should not contain any HTML because the JSON.parse method expects only JSON:

<?php 
    header("Content-type: application/json");

    $db_username = placeholder; 
    $db_password = placeholder; 
    $db_host = placeholder; 

    $result = $mysql->query(---Placeholder for correct SQL query---);

    while ($row = $result->fetch_object())
    {
       $queryResult[] = $row->present_tense;
    }
    $textboxValue = $queryResult[0];
    $textboxValue2 = $queryResult[2];
    echo json_encode(array('first'=>$textboxValue,'second'=>$textboxValue2));
?>

If your DB login info is in a separate file, then there should be no HTML or BODY tags only the PHP tags.