JQuery UI
Permalink
I want to use JQuery UI for a website. That's no problem when not logged in, but afther login it's a mess, because of conflicts with JQuery UI which is used for C5.
Any best practis?
Any best practis?
use the JQuery UI scripts, that are delivered with concrete5.
Yep, sorry I wasn't clear, but that's not the problem... it's the css en proberly some (extra) javascripting.
I use a default theme, so does concrete. And for example popup-layers behave strange. I understand this behaviour was expected, but what i realy like to know if there are some best practices to (re)use this without inter-fearing C5 core functionality.
I use a default theme, so does concrete. And for example popup-layers behave strange. I understand this behaviour was expected, but what i realy like to know if there are some best practices to (re)use this without inter-fearing C5 core functionality.
One option would be to include the offending script tag(s) in a condition.
With jQueryUI, that may make your site unrecognizable enough to make previewing pages a bit useless. It should beat the alternative, however.
<?php if (!$c->isEditMode()): ?> <script src="cause_problems_in_edit_mode.js"></script> <?php endif; ?>
With jQueryUI, that may make your site unrecognizable enough to make previewing pages a bit useless. It should beat the alternative, however.
The last reply does not work for me, as UI loaded when ever you are logged into C5. So if I am logged in and UI is loaded twice the toolbar does not show. This worked for me
<?php if(if($u->uName != "admin" && !$u->inGroup(Group::getByName('Administrators')))) { ?> <script type="text/javascript" src="//code.jquery.com/ui/1.10.1/jquery-ui.js"></script> <?php } ?>
First, this thread is 3 years old and way out of date.
To load jquery UI, the vastly preferred method is to use addHeaderItem(). concrete5 will then make sure it is loaded, but filter out any duplicate loads.
You can see this working in my 'Load jQuery.UI' addon.
http://www.concrete5.org/marketplace/addons/load-jquery-ui/...
You can either use it to learn the code you need, or just install the addon and add the block or attribute to a page where you want UI to be loaded.
To load jquery UI, the vastly preferred method is to use addHeaderItem(). concrete5 will then make sure it is loaded, but filter out any duplicate loads.
You can see this working in my 'Load jQuery.UI' addon.
http://www.concrete5.org/marketplace/addons/load-jquery-ui/...
You can either use it to learn the code you need, or just install the addon and add the block or attribute to a page where you want UI to be loaded.
Hi John
Thanks for this but Concrete5 has never filtered duplicate libraries for me. It is always a battle to get javascript working correctly, even when using addHeaderItem.
A plugin to load a javascript library. That is a joke - right? ++ for reasons to leave Concrete5 and start looking elsewhere for a CMS.
3 years old, doesn't matter. This is the internet, things live forever. It is still the one of the top results when searching this site and Google for "concrete5 jquery UI", therefore relevant until something better comes along or the docs become good or someone like yourself posts a better approach.
Thanks for this but Concrete5 has never filtered duplicate libraries for me. It is always a battle to get javascript working correctly, even when using addHeaderItem.
A plugin to load a javascript library. That is a joke - right? ++ for reasons to leave Concrete5 and start looking elsewhere for a CMS.
3 years old, doesn't matter. This is the internet, things live forever. It is still the one of the top results when searching this site and Google for "concrete5 jquery UI", therefore relevant until something better comes along or the docs become good or someone like yourself posts a better approach.
When loading jQuery or UI, you need to load concrete5's internal version. If you load from elsewhere, or a different version, then c5 will see it is a different item and won't filter it as a duplicate. Hence the resulting symbol table clash and script failure.
You have a bit more scope with loading ui.css because you can use the theme roller to output css that is scoped to within your c5 theme. Then just load it in addition to the c5 css.
If you want to play with other versions and cdn, I have an asset mapping pull on github (turned down because there are other thoughts on this for c5.7), but you could install it as an override and pull jquery or ui from a cdn.
https://github.com/concrete5/concrete5/pull/771...
You have a bit more scope with loading ui.css because you can use the theme roller to output css that is scoped to within your c5 theme. Then just load it in addition to the c5 css.
If you want to play with other versions and cdn, I have an asset mapping pull on github (turned down because there are other thoughts on this for c5.7), but you could install it as an override and pull jquery or ui from a cdn.
https://github.com/concrete5/concrete5/pull/771...
LukeBMM
!$c->isEditMode() worked for me. Thnx. Pretty obvious when you think about it. I just wrapped it around the jquery libraries I didn't want impacting concrete5's edit mode and it works a treat.
Correct me if I'm wrong, but addHeaderItem doesn't give you any control over what version of jquery or the jquery-ui is loaded. All my scripting has been coded based on 1.9.1 and 1.10.2.
Is there any documentstion on addHeaderItem? A search on it only brings up forum discussions.
Ta muchly, Paul
!$c->isEditMode() worked for me. Thnx. Pretty obvious when you think about it. I just wrapped it around the jquery libraries I didn't want impacting concrete5's edit mode and it works a treat.
Correct me if I'm wrong, but addHeaderItem doesn't give you any control over what version of jquery or the jquery-ui is loaded. All my scripting has been coded based on 1.9.1 and 1.10.2.
Is there any documentstion on addHeaderItem? A search on it only brings up forum discussions.
Ta muchly, Paul
