jQuery Upgrade im Backend && Double Jquery
Verfasst: Mi 26. Feb 2014, 10:31
Contenido Version 4.9.2:
IST
jQuery ist recht empfindlich, was die Reihenfolge geladener Plugins etc. angeht. So kann man jQuery-UI nur dann erfolgreich laden, wenn zuvor jQuery geladen wurde.
Wenn man allerdings folgende Ladereihenfolge hat, kommt es zu seltsamen begleiterscheinungen:
mit einem Fehler wie dem folgenden Quittiert:
Die Ursache, weshalb jquery doppelt eingebunden wird, liegt darin, dass ab 4.9 jquery für das Backend zur Verfügung steht und automatisch geladen wird.
Habe ich nun ein Layout, welches auch jQuery und jQuery-UI laden soll, werden die Scripte zweimal eingebunden. Einmal über das Backend-Framework, und einmal über die darzustellende Seite, die ja auch aus dem Layout generiert wird.
Anregung:
Nun kann man natürlich im Layout (unschönen) PHP-Code einfügen um jQuery nur dann zu laden, wenn die Seite NICHT im Backend geladen wird:
Klar das geht, bringt aber 2 ganz große Nachteile mit sich:
IST
Aktuelle Version:jQuery 1.8.3
jQuery-UI 1.8.3
Bei der Arbeit mit jQuery im Backend bin ich zudem auf folgendes Problem gestoßen.jQuery 2.1.0
jQuery-UI 1.10.4
jQuery ist recht empfindlich, was die Reihenfolge geladener Plugins etc. angeht. So kann man jQuery-UI nur dann erfolgreich laden, wenn zuvor jQuery geladen wurde.
Wenn man allerdings folgende Ladereihenfolge hat, kommt es zu seltsamen begleiterscheinungen:
Denn dann zum Beispiel wird ein einfaches Script zum öffenen eines UI-Dialogs wie dieses:jQuery → jQuery-UI → jQuery
Code: Alles auswählen
<script>
$(document).ready(function(){
//Modal
$('#cTpro_dialog_open').click(function() {
$('#cTpro_dialog').dialog("open");
});
$( "#cTpro_dialog" ).dialog({
autoOpen: false,
show: {
effect: "slide",
duration: 1000
},
hide: {
effect: "fold",
duration: 1000
},
resizable: true,
height:800,
width:800,
modal: true,
buttons: {
"Speichern": function() {
$('#form_auswahl').submit();
},
"Abbrechen": function() {
$('#form_empty').submit();
}
}
});
});
</script>
Ursache:Uncaught TypeError: Object [object Object] has no method 'dialog'
Die Ursache, weshalb jquery doppelt eingebunden wird, liegt darin, dass ab 4.9 jquery für das Backend zur Verfügung steht und automatisch geladen wird.
Habe ich nun ein Layout, welches auch jQuery und jQuery-UI laden soll, werden die Scripte zweimal eingebunden. Einmal über das Backend-Framework, und einmal über die darzustellende Seite, die ja auch aus dem Layout generiert wird.
Anregung:
Nun kann man natürlich im Layout (unschönen) PHP-Code einfügen um jQuery nur dann zu laden, wenn die Seite NICHT im Backend geladen wird:
Code: Alles auswählen
<?php
if(!cRegistry::isBackendEditMode()) {
?>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<?php
}
?>
- Das Layout muss mit PHP bestückt werden
- Versionsunterschiede. Nutzt man im Backend das (mit ausgelieferte) antiquierte 1.8.3, und verwendet im Front-End 2.1.0, kommt man sich ggf. mit dem Funktionsumfang und vor allem Funktionen die "deprecated" sind in die Quere.
- Fügt einen Config-Zeiger hinzu, mit dem man ganz einfach weitere jQuery und jQuery-UI Packeges (als jeweils separates Unterverzeichnis) im System ablegen kann.
- Dann kann jeder kurz die Konfig anpassen und einen Switch auf Version x.y.z ausprobieren
- Zudem ein Config-Switch, ob jQuery und jQuery-UI auch im Frontend verwendet werden soll (dies dann bei aktivierung einfach mit ins Layout laden).