jQuery: Load body of page into variable

Question

I'm using jQuery to load the result of a PHP script into a variable. The script is passed something that the user typed with a GET request. I want to take just what the script spit out into its <body> tag. Here's what I've tried:

JS:

function loader() {
    var typed = $('#i').val(); //get what user typed in
    $.get("script.php", {i: typed}, function(loaded) {dataloaded = loaded;});
    alert($(dataloaded).find('body'))
}

But it just displays [Objec object]. How can I get a useful value that is just the contents of the body of a loaded page?

I know the PHP works, I just need the JS.
The script echos something like 1!!2 (two numbers separated by two exclamation points).

Thanks!

what's the value of dataloaded? – errorhandler Mar 13 '11 at 21:38 — errorhandler, Mar 13 '11 at 21:38

score 2 · Answer 1 · answered Mar 13 '11 at 21:40

2

You are trying to access the dataloaded which might not be assigned due to the asynchronous nature of AJAX calls. The only safe place to access it is inside the success callback. Also you could use the .html() function to get the contents of the body tag:

function loader() {
    var typed = $('#i').val(); //get what user typed in
    $.get('script.php', { i: typed }, function(loaded) {
        alert($(loaded).find('body').html());
    });
}

Also note that if the script.php only echoes 1!!2 without a <body> tag it won't work.

answered Mar 13 '11 at 21:40

Darin Dimitrov

1,023,142
271
3,287
2,928

This just displays `null`. Leaving off the `.html()` displays the same `[Object object]`. Any ideas? – Nathan Mar 13 '11 at 23:07
@Nathan G., no idea, instead of using alerts to debug your javascript code I would strongly recommend you [FireBug](http://getfirebug.com/). It will provide you much more information about the AJAX request and eventually help you solve the problem. – Darin Dimitrov Mar 13 '11 at 23:09

score 0 · Answer 2 · answered Mar 13 '11 at 21:41

0

Without knowing what console.log prints it is hard to say, but try these

alert($(dataloaded).find('body').html());

Or

alert($(dataloaded).find('body').text());

answered Mar 13 '11 at 21:41

Jake N

10,535
11
66
112

`.html` just displays `null`. `.text()` displays an empty dialog. Any ideas? – Nathan Mar 13 '11 at 23:08

aiternal · Answer 3 · 2011-03-14T23:05:42.107

0

Use JSON type. I am not sure about whether your Jquery script correct or not but using JSON with a correct usage would solve problem. ie.:

function loader() {
    var typed = $('#i').val(); //get what user typed in
    $.get("script.php", {i: typed}, function(loaded) {dataloaded = loaded;},"json");
    alert($(dataloaded).find('body'))
}

And POST variable from script.php after encoding JSON. Use Php's json_encode() function. You need to create variable as an array. For example:

<?php 
$title = 'Hello World';
$content = 'Get well soon Japan!';
$arr=array('title'=>$title,'content'=>$content);
echo json_encode($arr);
?>

And Jquery would be something like:

function loader() {
var typed = $('#i').val(); //get what user typed in
$.get("script.php", {i: typed}, function(loaded) {var dataloaded = loaded.title+" "+loaded.content;},"json");
$("body").html(dataloaded);
}

You may need to use Jquery's parseJson() functions on some situations. Don't think you will need here.

edited Mar 14 '11 at 23:05

answered Mar 13 '11 at 23:36

aiternal

1,080
3
16
33

Well, I didn't tested Jquery script on my pc whether it is true cause editor not open and will sleep soon. But I believe that JSON type will solve the issue. And you should echo encoded array at your PHP file. – aiternal Mar 13 '11 at 23:58
@Nathan G. I if I didn't understand wrong you want to write grabbed text inside body. Look at my update. – aiternal Mar 14 '11 at 09:27
@Ahmet I don't want to show the retrieved text, I want to assign the part of it that represents the body of the page retrieved to a variable for processing. – Nathan Mar 14 '11 at 14:30
Then change you get function like (based on my sample php script): `function(loaded) {var dataloaded = $.parseJson(loaded.title)+" "+$.parseJson(loaded.content);}` and use it your way: `alert($(dataloaded).find('body').html());` – aiternal Mar 14 '11 at 23:04
And also it might be better to put a `var` before `dataloaded` on your get function. – aiternal Mar 14 '11 at 23:06
Just if someones comes acroos this http://stackoverflow.com/questions/14423257/find-body-tag-in-an-ajax-html-response – mitomed Jun 27 '14 at 15:31

score 0 · Accepted Answer · answered Mar 14 '11 at 17:08

I changed the page that I'm trying to fetch to XML. I'm using $.find to get each element of interest individually from the XML page, which suits this particular app well.

This problem has disappeared, as there is no longer a head section to ignore, and I'm just grabbing individual XML elements anyway.

Thanks for all your time and help!

jQuery: Load body of page into variable

4 Answers4

Linked