+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forumdisplay.php?fid=20)
+--- Forum: Archived Development & Programming (https://forum.codeigniter.com/forumdisplay.php?fid=23)
+--- Thread: How to extract data from JSON string by using JQuery (/showthread.php?tid=37670)
How to extract data from JSON string by using JQuery - El Forum - 01-17-2011
[eluser]mi6crazyheart[/eluser]
Hey Guys,
I'm PHP developer but this is first time i'm working with some JSON stuff & high level of javascript which i really not habituated a lot. Right now i've stuck at one positions from where i'm not getting any route to move forward.
The matter is..
I've a JSON string like this :
Code:
[{"ThreadID":"213","ThreadTitle":"Christian Heilmann's talk for the why of HTML5 for games development","ThreadAuthorFirstName":"Suresh kumar"},{"ThreadID":"208","ThreadTitle":"The PHP Switch Statement","ThreadAuthorFirstName":"Suresh kumar"},{"ThreadID":"212","ThreadTitle":"DaVinci prototype on Xbox Kinect","ThreadAuthorFirstName":"Suresh kumar"}]" ThreadID-ThreadAuthorFirstName-ThreadTitle "
It's from 2days i'm googling a lot & made number of futile attempt. But, yet now no luck..
. So, Is there any JQuery ninja who can help & show me some path...
How to extract data from JSON string by using JQuery - El Forum - 01-17-2011
[eluser]rdjs[/eluser]
Is this what you need?
jQuery parse JSON
Code:
var obj = jQuery.parseJSON('{"name":"John"}');
alert( obj.name === "John" );How to extract data from JSON string by using JQuery - El Forum - 01-17-2011
[eluser]Victor Michnowicz[/eluser]
This should get you started on the right track:
Code:
var obj = jQuery.parseJSON('{"json":[{"ThreadID":"213","ThreadTitle":"Christian Heilmann\'s talk for the why of HTML5 for games development","ThreadAuthorFirstName":"Suresh kumar"},{"ThreadID":"208","ThreadTitle":"The PHP Switch Statement","ThreadAuthorFirstName":"Suresh kumar"},{"ThreadID":"212","ThreadTitle":"DaVinci prototype on Xbox Kinect","ThreadAuthorFirstName":"Suresh kumar"}]}');
for (var i in obj.json) {
alert(obj.json[i].ThreadID);
}The jQuery function .getJSON() could come in handy depending on how you are accessing your JSON.
Make sure you escape your apostrophes too.
How to extract data from JSON string by using JQuery - El Forum - 01-17-2011
[eluser]mi6crazyheart[/eluser]
Thx u @rdjs & @elvicmic for u'r quick replies...
@elvicmic Your piece of code worked like a charm. I just modified it as u'd suggested by using getJSON(). Here is that piece of code. But, it's not working. Can u help me to figure out what's going wrong...
Code:
$.getJSON("http://localhost/CI/index.php/welcome/chromeExtension", function(data) {
var obj = jQuery.parseJSON(data);
for (var i in obj.json)
{
alert(obj.json[i].ThreadID);
}
});How to extract data from JSON string by using JQuery - El Forum - 01-17-2011
[eluser]Victor Michnowicz[/eluser]
.getJSON returns the JSON object, so you don't need to convert it again using .parseJSON().
I think this should work:
Code:
$.getJSON("http://localhost/CI/index.php/welcome/chromeExtension", function(data) {
for (var i in data)
{
alert(data[i].ThreadID);
}
});I recommend Firebug when dealing with this kind of stuff. It can help a lot. Make sure you set your headers correctly too.
How to extract data from JSON string by using JQuery - El Forum - 01-20-2011
[eluser]mi6crazyheart[/eluser]
@elvicmic Sorry for late reply. Again u'r above code worked without any problem. Thx a lot for that. But, the thing is that.. i'm doing all these for a google chrome extension. So, when i use above code inside my chrome extension it giving error like...
"XMLHttpRequest cannot load http://localhost/CI/index.php/welcome/chromeExtension. Origin chrome-extension://fddehjfinihjhhcnolbpbhckaagaefbp is not allowed by Access-Control-Allow-Origin.
localhost/CI/index.php/welcome/chromeExtensionFailed to load resource"
May b that why u'd suggested that "set headers correctly" . But, still using those headers in my controller function.. i've no luck(may be i'm not using the headers properly in side that controller function)..
My controller function is like this...
Code:
function chromeExtension()
{
$this->load->model('home/welcome_page_model');
$data = $this->welcome_page_model->latestThreadsForChromeExtension();
$this->output->set_header('Last-Modified: '.gmdate('D, d M Y H:i:s', $last_update).' GMT');
$this->output->set_header("Cache-Control: no-store, no-cache, must-revalidate");
header('Content-type: application/json');
echo json_encode($data);
}For headers i'm using codeigniter output class : http://ellislab.com/codeigniter/user-guide/libraries/output.html
How to extract data from JSON string by using JQuery - El Forum - 01-20-2011
[eluser]Victor Michnowicz[/eluser]
I think the problem is that JSON is subject to same origin policy.
JSONP should be the answer. I have never dealt with JSONP, however. Maybe these links can help you out?:
http://api.jquery.com/jQuery.getJSON/#jsonp
http://api.jquery.com/jQuery.ajax
http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/
http://1080d.com/lang/en-us/2009/10/converting-php-to-jsonp-with-json_encode/