Opened 11 years ago
Closed 11 years ago
#12363 closed bug (notabug)
Selector fails for top elements on $.ajax response
| Reported by: | Owned by: | ||
|---|---|---|---|
| Priority: | undecided | Milestone: | None |
| Component: | unfiled | Version: | 1.8.0 |
| Keywords: | Cc: | ||
| Blocked by: | Blocking: |
Description
Hi!
I'm using $.ajax to partially update an HTML page. I request the whole page and use "success" callback to select the part I want to update:
$.ajax({
url: "/this_same_page.jsp",
success: function(data) {
var new_content = $("#id_of_the_part_i_wanna_update", data);
$("#id_of_the_part_i_wanna_update").html(new_content);
}
});
That code always works unless "#id_of_the_part_i_wanna_update" refers to a top level tag into the page body.
For example, it will work if the response is something like:
<html>
<body>
<div>
<div id="id_of_the_part_i_wanna_update">New Content</div>
</div>
</body>
</html>
But it won't if the "id_of_the_part_i_wanna_update" div becomes top-most, say:
<html> <body> <div id="id_of_the_part_i_wanna_update">New Content</div> </body> </html>
It can be tested by "alert"ing the result of the selector:
$.ajax({
url: "/this_same_page.jsp",
success: function(data) {
var new_content = $("#id_of_the_part_i_wanna_update", data);
alert(new_content);
}
});
In the later case, I mean when selecting a top-most element, jQuery 1.7.2 will return "null" whereas jQuery 1.8.0 will return "undefined".
It also fails if querying by class name:
$(".some_class", data)
or just by tag mane:
$(".some_class", data)
... as far as the selected tag is top-most into the page body.
Regards, Miguel Angel
Thanks for contributing! Please ask for further help on the forums or stackoverflow, but you're using the jquery function incorrectly. It just happened to work weirdly enough. What you should be doing, assuming that
datais some html is:$.ajax({ url: "/this_same_page.jsp", success: function(data) { $("#id_of_the_part_i_wanna_update").html(data); } });If you need further help, ask for it on the forums! Thanks!