Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Mar 2011
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Prototype framework and JSON AJAX problem.

    I'm trying to make an AJAX request to my localhost server. Here is the code for the page that is requested, ajaxresponsecontent.php. The content is queried from a MySQL database then encoded into JSON using PHP.

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <script type="text/javascript" src="../javascript/prototype.js"></script>
    <?php  
    
        @ $db = mysqli_connect('localhost', 'root', '', 'mealchamp');
    
    	$query = "SELECT * FROM globalfood WHERE foodid = 1";
    	$result = mysqli_query($db, $query);
    	$row = mysqli_fetch_assoc($result);
    
    	$reqVar = json_encode($row);
    	$reqVar = "'" . $reqVar . "'";
    	echo $reqVar;
    
    ?>
    </head>
    <body>
    </body>
    </html>
    The output of the content page when run in a browser is serialized JSON:

    '{"foodid":"1","food":"Mozzarella cheese","brand":"Black Diamond","ftype":"Dairy & Alternatives","servamt":"1\/4 inch cube","ss":"30.0","cal":"110.0","fat":"8.0","sat":"5.0","trans":"0.2","chol":"25.0","sod":"230.0","c arb":"1.0","fib":"0.0","sug":"0.0","pro":"8.0"}'

    The second page, ajaxresponsecaller.php, makes an ajax request for this previous page using the Prototype framework. the code for the requesting page is:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <script type="text/javascript" src="../javascript/prototype.js"></script>
    <script type="text/javascript"><!--
    
    new Ajax.Request('ajaxrequestcontent.php',
      {
        method:'get',
        onSuccess: function(transport){
          var response = transport.responseText || "no response text";
    			document.write(response);
    			var try1 = response.evalJSON();
    			document.write(try1.food);
        },
        onFailure: function(){ alert('Something went wrong...') }
      });
    
    --></script>
    </head>
    <body>
    </body>
    </html>
    The PROBLEM is that the document.write(response) works fine in that it outputs the JSON string just how its supposed to be, same output as i showed above for the previous page. but when i try to use Prototypes' evalJSON to convert it to an object, something is going wrong. document.write(try1.food); gives no output.

    What am i doing wrong exactly? could u provide an example? been working at this for hours can't figure out the problem.

    Thanks so much, G

  • #2
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,184
    Thanks
    10
    Thanked 569 Times in 550 Posts
    don't use any html on the response you will eval(), it should be just JSON.
    the data in you first example is floating around the <head>, I doubt that's where it's supposed to be placed...
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/1/19) IE7:0.2, IE8:6.7, IE11:7.4, IE9:3.8, IE10:4.4, FF:18.3, CH:43.6, SF:7.8, MOBILE:27.5

  • #3
    New Coder
    Join Date
    Mar 2011
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ok i will move it from the head to the body, is taht what you mean?

    i dont understand what you mean it should be all JSON can you elaborate and provide an example? please be specific i'm trying to learn

  • #4
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,184
    Thanks
    10
    Thanked 569 Times in 550 Posts
    try using

    Code:
    var try1 = JSON.parse(response);
    in the second one instead of using prototype's method...
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/1/19) IE7:0.2, IE8:6.7, IE11:7.4, IE9:3.8, IE10:4.4, FF:18.3, CH:43.6, SF:7.8, MOBILE:27.5


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •