Search code examples
jqueryjoomlamootools

jQuery('select') error in Joomla 3.3 administator


I'm running a Joomla! 3.3.0 installation and the front-end is fine, however I'm getting a Uncaught TypeError: undefined is not a function in the back end that is really annoying.

When the error occurs, the "Search Tools" button doesn't work and I can't search a keyword, and the article/module edit page doesn't display any tabs.

This is really strange behavior since the error can disappear if I refresh the page a few times.

I realise this is most probably a Mootools/jQuery conflict, but in theory everything is the way it should be regarding noConflict being enabled.

Here is the error I get:

Uncaught TypeError: undefined is not a function -> index.php?option=com_content&view=articles:206

The lines where the error is displayed:

jQuery(document).ready(function (){
                    jQuery('select').chosen({"disable_search_threshold":10,"allow_single_deselect":true,"placeholder_text_multiple":"Selecione alguma op\u00e7\u00e3o","placeholder_text_single":"Selecione uma op\u00e7\u00e3o","no_results_text":"Sem resultados correspondentes"});
                });

I'm using Isis template whit no modifications for the administrator and this is how the .js files are being called in the head:

  <script src="/media/jui/js/jquery.min.js" type="text/javascript"></script>
  <script src="/media/jui/js/jquery-noconflict.js" type="text/javascript"></script>
  <script src="/media/jui/js/jquery-migrate.min.js" type="text/javascript"></script>
  <script src="/media/jui/js/bootstrap.min.js" type="text/javascript"></script>
  <script src="/media/jui/js/jquery.ui.core.min.js" type="text/javascript"></script>
  <script src="/media/jui/js/jquery.ui.sortable.min.js" type="text/javascript"></script>
  <script src="/media/system/js/mootools-core.js" type="text/javascript"></script>
  <script src="/media/system/js/core.js" type="text/javascript"></script>
  <script src="/media/system/js/mootools-more.js" type="text/javascript"></script>
  <script src="/media/system/js/tabs-state.js" type="text/javascript"></script>
  <script src="/media/system/js/multiselect.js" type="text/javascript"></script>
  <script src="/media/jui/js/chosen.jquery.min.js" type="text/javascript" async="async"></script>
  <script src="/media/jui/js/jquery.searchtools.min.js" type="text/javascript"></script>
  <script src="/media/system/js/html5fallback.js" type="text/javascript"></script>
  <script src="templates/isis/js/template.js?7069fd2c34fe5425e23362e429f9e94a" type="text/javascript"></script>
  <script src="plugins/content/mgthumbnails/shadowbox/shadowbox.js" type="text/javascript">     </script>

I already tried plugins Mootools Enabler/Disabler and jQuery Easy with no luck, all they do is to break both front and back-end if I disable mootools or mootools-more.


Solution

  • I figured it out.

    The problem was a conflict with the plugin Javascript Async & Defer.

    With it disabled the problem is gone.