4

i am trying to get the JSON data from php page on ajax call.The php page is returning the AJAXstring, now i have to get that JSON data and display values separately.

How can i do this???

here is code i am using.... When i run this code to get the data product_id, it is showing alert undefined.

code:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Request json test</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script language="JavaScript">
$(document).ready(function(){
    $("#testjson").click(function(e){
        startJsonSession();
        return false;
    });

    function startJsonSession(){  
        $.ajax({
            url: "index.php",
            cache: false,
            dataType: "json",
            complete: function(data) {
                pid = data.product_id;
                alert(pid);
            }
        });
    }
}); 
</script>

</head>
<body>
<a href="#" id="testjson">Get JSON Data</a>
<div id="showdata"></div>
</body>
</html>

JSON output from index.php:

[{"ID":"1","product_id":"3","image_name":"cycle5.png","image_type":".jpg"},{"ID":"2","product_id":"6","image_name":"cycle3.png","image_type":".jpg"},{"ID":"3","product_id":"4","image_name":"cycle2.png","image_type":".jpg"},{"ID":"4","product_id":"43","image_name":"cycle1.png","image_type":".jpg"},{"ID":"5","product_id":"7","image_name":"cycle8.png","image_type":".jpg"},{"ID":"6","product_id":"9","image_name":"cycle0.png","image_type":".jpg"},{"ID":"7","product_id":"543","image_name":"cycle6.png","image_type":".jpg"},{"ID":"8","product_id":"445","image_name":"cycle9.png","image_type":".jpg"},{"ID":"9","product_id":"453","image_name":"cycle75.png","image_type":".jpg"},{"ID":"10","product_id":"725","image_name":"cycle86.png","image_type":".jpg"}]
tlenss
  • 2,609
  • 2
  • 22
  • 26
CJAY
  • 6,989
  • 18
  • 64
  • 106
  • 1
    show the structure of response data – Pranav C Balan Jan 31 '14 at 12:38
  • are you sure that you got a proper json response? Check your browsers network inspector or just show your relevant PHP-Code – thpl Jan 31 '14 at 12:38
  • As Pranav said, you need to show what `index.php` returns. If it returns a json encoded string you will need to decode it in javascript using `JSON.parse` - `data = JSON.parse(data)` – Cjmarkham Jan 31 '14 at 12:39
  • 1
    @CarlMarkham : no need to parse it again, already there is `dataType: "json",` – Pranav C Balan Jan 31 '14 at 12:40
  • I have updated the post...please review.. – CJAY Jan 31 '14 at 12:40
  • Make sure that you are getting JSON response by inspecting the webresponse using mozilla firebug. And again try response = $.parseJSON(resultJson); before assigning pid. – shanavascet Jan 31 '14 at 12:41

1 Answers1

6

To get first product_id

pid = data[0].product_id
alert(pid);

Fiddle Demo

To get each product_id from response

complete: function(data) {
    $.each(data,function(){
        alert(this.product_id);
    });
}

Fiddle Demo

Pranav C Balan
  • 113,687
  • 23
  • 165
  • 188