Joomla wird in der Version 3.3.6 mit dem Template Protostar eingesetzt. Für ein eigenes Plugin wird Javascript bzw. jQuery benötigt. Dies habe ich wie folgt eingebunden
$document = JFactory::getDocument();
$document->addScript(“media/plg_my-plugin/js/my-javascript-file.js”);
Das Script wurde nicht angewendet. Wenn man nun z.B. mit Firebug im Firefox nachsieht, dann sieht es wie folgt aus:
<script type=”text/javascript” src=”/site/media/plg_my-plugin/js/my-javascript-file.js”>
<script type=”text/javascript” src=”/site/media/jui/js/jquery.min.js”>
<script type=”text/javascript” src=”/site/media/jui/js/jquery-noconflict.js”>
<script type=”text/javascript” src=”/site/media/jui/js/jquery-migrate.min.js”>
<script type=”text/javascript” src=”/site/media/system/js/caption.js”>
<script type=”text/javascript” src=”/site/media/jui/js/bootstrap.min.js”>
<script type=”text/javascript” src=”/site/templates/site/js/template.js”>
<script type=”text/javascript” src=”/site/media/system/js/mootools-core.js”>
<script type=”text/javascript” src=”/site/media/system/js/core.js”>
<script type=”text/javascript” src=”/site/media/com_finder/js/autocompleter.js”>
Hier gut zu sehen, dass das eigene Script vor jquery und bootstrap geladen wird, was den Fehler:
ReferenceError: jQuery is not defined
jQuery(document).ready(function() {
in der Konsole anzeigt. Die Lösung ist im vor dem eigenen Script das Bootstrap Framework wie folgt zu laden:
$document = JFactory::getDocument();
JHtml::_(‘bootstrap.framework’);
Dann sieht die Reihenfolge so aus
<script type=”text/javascript” src=”/site/media/jui/js/jquery.min.js”>
<script type=”text/javascript” src=”/site/media/jui/js/jquery-noconflict.js”>
<script type=”text/javascript” src=”/site/media/jui/js/jquery-migrate.min.js”>
<script type=”text/javascript” src=”/site/media/jui/js/bootstrap.min.js”>
<script type=”text/javascript” src=”/site/media/plg_my-plugin/js/my-javascript-file.js”>
<script type=”text/javascript” src=”/site/media/system/js/caption.js”>
<script type=”text/javascript” src=”/site/templates/site/js/template.js”>
<script type=”text/javascript” src=”/site/media/system/js/mootools-core.js”>
<script type=”text/javascript” src=”/site/media/system/js/core.js”>
<script type=”text/javascript” src=”/site/media/com_finder/js/autocompleter.js”>
und alles funktioniert wie es sollte.