0

I am using a jquery ajax get method to fetch information from the server however I am having trouble parsing the information so that I may use it. My website has a gallery of products that will filter its items based on category.

Here is the jQuery ajax function:

$('.category').click(function() {

        var category;

        if ($(this).hasClass('Shirts')) {
            category = 'shirts';
        }
        if ($(this).hasClass('Hats')) {
            category = 'hats';
        }
        if ($(this).hasClass('Acc')) {
            category = 'acc';
        }

        $.ajax({
            type: 'GET',
            url: 'galleryfetch.php',
            data: { 'category' : category },
            dataType: 'json',
            success:  function(data) {
                arr = $.parseJSON(data);
                alert(arr);
            }
        });
    });

This is the php script that the information is posted to:

<?php

    if ($_SERVER['REQUEST_METHOD'] == 'GET') {

        $category = $_GET['category'];

        $conn = mysqli_connect('localhost', '*****', '*****', 'clothing');  

        $rows = mysqli_query($conn, "SELECT * FROM products WHERE category = '".$category."'");



        while ($row = mysqli_fetch_array($rows)) {

            $arr[] = $row; 
        } 

        echo json_encode(array('data' => $arr));
    }

I using the alert in the success function to see if the information is passed succesfully but at the moment there is no alert and i get an: Unexpected token o error.

I'm not sure if I'm parsing the information correctly or if Im not correctly using JSON

yassine__
  • 393
  • 4
  • 15
Mikey
  • 366
  • 1
  • 4
  • 20
  • 2
    **Danger**: You are **vulnerable to [SQL injection attacks](http://bobby-tables.com/)** that you need to [defend](http://stackoverflow.com/questions/60174/best-way-to-prevent-sql-injection-in-php) yourself from. – Quentin Aug 26 '14 at 10:55
  • try data: { "category" : "category"}. because json format is support double quote – Bhumi Shah Aug 26 '14 at 10:56
  • @BhumiShah — That's a JavaScript object literal, not JSON. – Quentin Aug 26 '14 at 10:57

1 Answers1

1

tl;dr: $.parseJSON(data); should be removed.

Your server is returning JSON (but claiming it is sending HTML, you should have header("Content-Type: application/json")).

You have told jQuery to ignore the claim that it is HTML and parse it as JSON. (This would be redundant if you fixed the above problem)

dataType: 'json',

The parsed data is passed to your success function.

You then pass that data to JSON.parse so it gets converted to a string (which will look something like [ [Object object], ... and is not valid JSON) and then errors.

Remove:

arr = $.parseJSON(data);

And just work with data.

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • Okay, the alert now says Object[object]. How do I access the data contained in that object ? – Mikey Aug 26 '14 at 11:00
  • @Mikey — The same way you access the data in any other object. `variable_name.property_name`. – Quentin Aug 26 '14 at 11:01
  • So in theory I should be able to access the 'id' element of the first array in row by using alert(data[0].id) ? Because I then get a console error of 'Cannot read property id of undefined'. If I use alert(data[0]) I get an alert of 'undefined' and if I use alert(data.id) I also get an alert of 'undefined' – Mikey Aug 26 '14 at 11:06
  • `echo json_encode(array('data' => $arr));` - you don't have an array. You have an object with a property called `data` that contains an array. – Quentin Aug 26 '14 at 12:01
  • Okay, problem is I have more than one array in the data object. So I'm not sure how to access the data inside these arrays once Im in the success function of the ajax callback. Using data[0], data[0].id, data.id all dont work :( – Mikey Aug 26 '14 at 13:00
  • Your object looks something like this: `var data = { data: [] }`. Don't get the two different things called `data` confused. – Quentin Aug 26 '14 at 13:01
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/60010/discussion-between-mikey-and-quentin). – Mikey Aug 26 '14 at 13:46