retrieve json formatted data using xmlhttp request

Question

I was using jQuery and this was done easily but I want to change it to regular javascript because I will be using it with phonegap and I don't want to loop through js frameworks every time I make a request to the server. Maybe it's a bad reason to go away from jQuery but seems like it would make everything faster. So I need some help with this code:

<body onload="init();">
  <div id="daily"></div>

<script>
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange=function(){
    if (xmlhttp.readyState === 4 && xmlhttp.status === 200){
      var a = JSON.parse(xmlhttp.responseText);
      document.getElementById('daily').innerHTML = a.items;
    }
  };
  xmlhttp.open("GET", serviceURL +"getmainnews.php" , true);
  xmlhttp.send();
  }
</script>

getmainnews.php

//mysqli query
$daily = array();
while ($r = mysql_fetch_assoc($day)){
  $daily[] = $r;
}
echo json_encode(array("items" => $daily, "allitems" => $mainnews,...));

In the Chrome DT, I can see the encoded data which is returned but I can't display the first item into my first div with id="daily". With the code I provided, all I get is [object, Object]. What am I doing wrong?

EDIT:

So my query selects the entire row from my database and it's in an array:

{"items":[{"id":"1","pic":"","topic":"daily","article":" \\t\\t\\t\\t\\t \\t\\t\\t\\t\\t\З...","link":"http://www....","text_cont":..."}]}

How can I display just the pic and the article without all the other junk? Do I have to modify my php file?

EDIT 2:

$day = mysql_query("SELECT pic, article, link FROM table WHERE topic='daily' ORDER BY id DESC LIMIT 1");
$daily = array();
while ($r = mysql_fetch_assoc($day)){
$daily[] = $r;
}

$exc = mysql_query("SELECT pic, article, link FROM table WHERE topic='exclusive' ORDER BY id DESC LIMIT 1");
$excl = array();
while ($e = mysql_fetch_assoc($exc)){
$excl[] = $e;
}

$mus = mysql_query("SELECT pic, article, link FROM table WHERE topic='must' ORDER BY id DESC LIMIT 1");
$must = array();
while ($m = mysql_fetch_assoc($mus)){
$must[] = $m;
}
echo json_encode(array("items" => $daily, "exc" => $excl, "must" => $must));

That's my full php file with the queries. Items, exc, and must are arrays, so the responseText, I guess, is a multidimensional array? Is that the problem I'm having with displaying it?

EDIT 3:

console.log(a.items) gives me an "undefined" so I logged the xmlhttp.responseText.

控制台日志

Answer 1

Without seeing exactly what your JSON looks like it is hard to know for sure. However since you are encoding an array, I suspect changing:

a.items

to

a[0].items

will do the trick...

Edit

I would do:

document.getElementById('daily').innerHTML = JSON.stringify(a.items);

That will convert your object into a string that can be assigned to the innerHTML of an element. I am not sure if this is exactly what you want to do, but when you find the element you want to display using that method should work.

Edit 2

You could change your PHP to only output what you want. However, you could filter it in your JS as well:

a.items[0].pic

and

a.items[0].article

If those don't display as is you can use the stringify method, but you shouldn't need to since those items appear to be strings.

Also note, if you have multiple items you will need to change the 0 to the index of the item you are targeting.

retrieve json formatted data using xmlhttp request

Question

1 answers

solution1
1 2013-07-28 15:01:36

retrieve json formatted data using xmlhttp request

Question

1 answers

solution1 1 2013-07-28 15:01:36

solution1
1 2013-07-28 15:01:36