Jquery.noConflict + MooTools - load() Does Not Work With Specified Div Dima Michaelov
Basically here's situation:

You have both jQuery and MooTools on your page, with jQuery in noConflict mode. And you have a code like so:

jQuery('#some_block').load('/some-ajax-call #id_to_extract');
(to learn what it does: http://api.jquery.com/load/)

But, HUH?!, it doesn't work! Well, the problem is with MooTools redefining the getElementById function (thank them very much). Now we have to emulate the same thing through our custom code. and Here it is:

$.get('/some-ajax-call', function (data) {
  // replace all new line characters, then delete anything before and after form tag (works for ASP.NET, in other platform may be different)
  var html = data.replace(/(\r|\n)+/g, '').replace(/.+(<\/form>).+/, '$1');
  // create dummy div in our placeholder and hide it
  var $dummy = $('#some_block').append('').children('#__DUMMY__').hide();
  // append html to our hidden dummy
  $dummy.append(html);
  // replace whole block with needed content
  $('#some_block').replaceWith($('#id_to_extract'));
  // not necessary, but anyway
  $dummy.remove();
});

The above code work a bit different than the jQuery.load() code, but it does save the day.

This blog post describes the issue when using jQuery alongside MooTools lib (look at last comment for description of issue):
http://forum.jquery.com/topic/jquery-noconflict-mootools-load-does-not-work-with-specified-div
posted: 22/12/2010 11:13:11
0 Comments