Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
I'm trying to update #content div with AJAX and losing all javascript-provided functionality on a fresh minimal installation of Drupal 7.14.
The simplest test to see the problem:
- Go to /admin/structure/block
- Execute
jQuery("#content").html( jQuery("#content").html() ); Drupal.attachBehaviors("#content");
in JS console. Now you can't move blocks and the "Show row weights" link is broken.
Diff to reproduce in Drupal 7.14/themes/bartik :
=== added file 'ajax_update.js'
--- ajax_update.js 1970-01-01 00:00:00 +0000
+++ ajax_update.js 2012-07-28 03:26:31 +0000
@@ -0,0 +1,4 @@
+jQuery(document).ready(function() {
+ jQuery("#content").html(jQuery("#content").html());
+ Drupal.attachBehaviors("#content");
+});
=== modified file 'bartik.info'
--- bartik.info 2012-07-28 03:08:42 +0000
+++ bartik.info 2012-07-28 03:10:24 +0000
@@ -10,6 +10,8 @@
stylesheets[all][] = css/colors.css
stylesheets[print][] = css/print.css
+scripts[] = ajax_update.js
+
regions[header] = Header
regions[help] = Help
regions[page_top] = Page top
Edit:
More complex example to avoid blaming class changes (-processed):
=== added file 'ajax_update.js'
--- ajax_update.js 1970-01-01 00:00:00 +0000
+++ ajax_update.js 2012-07-28 03:44:47 +0000
@@ -0,0 +1,23 @@
+jQuery(document).ready(function() {
+
+ jQuery.get(window.location.pathname, {}, function(data) {
+ //cross platform xml object creation from w3schools
+ try { // IE
+ retrieved_dom=new ActiveXObject("Microsoft.XMLDOM");
+ retrieved_dom.async="false";
+ retrieved_dom.loadXML(data);
+ } catch(e) {
+ try { // normal browsers
+ parser=new DOMParser();
+ retrieved_dom=parser.parseFromString(data,"text/xml");
+ } catch(e) {
+ console.log(e.message);
+ return;
+ }
+ }
+
+ jQuery("#content").html( jQuery("#content", retrieved_dom).html() );
+ });
+
+ Drupal.attachBehaviors("#content");
+});
=== modified file 'bartik.info'
--- bartik.info 2012-07-28 03:08:42 +0000
+++ bartik.info 2012-07-28 03:09:50 +0000
@@ -10,6 +10,8 @@
stylesheets[all][] = css/colors.css
stylesheets[print][] = css/print.css
+scripts[] = ajax_update.js
+
regions[header] = Header
regions[help] = Help
regions[page_top] = Page top
Comment | File | Size | Author |
---|---|---|---|
#6 | before-ajax.png | 3.51 KB | roynilanjan |
#6 | after-load-ajax-response.png | 2.94 KB | roynilanjan |
Comments
Comment #0.0
int_ua CreditAttribution: int_ua commenteds/patch/diff/
Comment #0.1
int_ua CreditAttribution: int_ua commentedComment #1
int_ua CreditAttribution: int_ua commentedComment #2
nod_not really no.
try this
Drupal.attachBehaviors($("#content")[0]);
, this is what attachBehaviors is expecting, a DOM element, not a jQuery object, not a selector.Comment #3
nod_Also, read this: http://drupal.org/node/756722
And I'm sorry but learn javascript, this is all over the place and doesn't make much sense.
Comment #4
int_ua CreditAttribution: int_ua commentedThanks,
jQuery("#content")[0]
helped :)Comment #5
int_ua CreditAttribution: int_ua commentedWell, not really. If I try to load a different page ( replace window.location.pathname with "/admin/structure/block" and go to /admin/structure/ ) the behaviors still don't work. AFAIU the Drupal.settings is to blame.
Comment #6
roynilanjan CreditAttribution: roynilanjan commentedHi,
Please have a look my snippet below try some play with attachBehaviors.. should I use any html out put in my response so that I can see the attachbehaviour effect?
or give me an example where this attachbehaviour use is justified
(function($){
Drupal.behaviors.somebehavior = {
attach: function (context, settings) {
$('#edit-somebutton', context).live('click', function () {
$('#edit-someoutput').load('/somecallback','data=nilanjan',function() {
//Drupal.attachBehaviors('#edit-name');
Drupal.attachBehaviors($("#edit-someoutput")[0]);
});
return false;
});
}
};
})(jQuery);
Comment #7
nod_Support requests can't be critical.
You should be using the #ajax framework. There is no need to use jQuery ajax directly when using From API. In fact, it shouldn't be used at all since that breaks no-js clients.
#6 has nothing to do with the initial issue. You can always open a new support issue with a correct title.
Comment #8
roynilanjan CreditAttribution: roynilanjan commentedOk sure tnx for your reply... I wanted to experiment how reattach behavior works on success callback response element(dom)
Comment #9
seutje CreditAttribution: seutje commentedI'm confused, is there anything that still needs some clearing out here or not?
Comment #9.0
seutje CreditAttribution: seutje commentedmore complex example
Comment #10
nod_Create a new issue if not addressed.