Loading jquery-ui all the time

Permalink 1 user found helpful
I noticed this loads if you are logged in but NOT if you are just visiting. I need it to load all the time (I think). Anyone know how?



Steven Braun
Rollermonkey Design Group
1190 Tapadero Trail
Reno, NV 89521



View Replies:
adamjohnson replied on at Permalink Reply
On Andrew's site, he shows how to not load jquery when not logged in. That might give you a good place to start looking.

Mnkras replied on at Permalink Reply
Lets try this, copy
to elements/page_controls_header.php

and copy concrete/elements/header_required.php to the same place, open them both,

in the page_controls put // before $this->addHeaderItem($html->javascript('jquery.ui.js'));

in header_required paste ^ that under
$this->addHeaderItem($html->javascript('ccm.base.js'), 'CORE');

Try that

eOne replied on at Permalink Reply
hi Mike,

I've tried that, and it seems it is loading (in source ) but I still cannot get modal window to pop-up.
In similar manner I've added ui.css.

Do you maybe know should I be loading something else aswell ?
mnakalay replied on at Permalink Reply
this thread was started a long time ago (2010) but since it has been reactivated, check this free add-on by JohntheFish, it does just that

Good luck all
eOne replied on at Permalink Reply
tnx mnakalay,

that was the first thing I've tried but no luck. After that I've done some search and got here...

maybe there is something wrong with the rest of my code ( modal dialog )

mnakalay replied on at Permalink Reply
well would you like to show your code so we can have a look?
eOne replied on at Permalink Reply
when you choose "send e-card" you don't get modal pop-up but opens new page and get some errors. Same code, while in edit mode works just fine, even use ajax to send e-mail without problem.

my guess I need to "attach" more jquery stuff... ?

in case you don't see code used to call modal is:

<div class="sendNaslov"><div class="sadrzaj"><div class="naslov"><h1>Pošalji e-card</h1></div>
dialog-title="Send your e-card"
href="http://solin-info.hr/ecard_form"><div class="botun"></div></a>

<script type="text/javascript">$(function() { $("#ecardDialog").dialog(); });</script>

ecard_form.php is single page, visible to guests. But as I say, it works when I am logged in, doesn't when not.
mnakalay replied on at Permalink Reply
Something I don't really understand is that your script tries to use some content inside some tag with the id #ecardDialog
However that id doesn't exist. On the page in which you have your form to send the cards, you have divided your cod in 2 div, one has an id of #galerija and the other one #formular.
So I don't understand how it even works in edit mode.

What you could try is surround everything in your ecard page with a div with an id of #ecardDialog and see if it works.
eOne replied on at Permalink Reply
a has id=ecardDialog.

This is built following some examplese here on forums. I might did something wrong though but I don't think so.
As in that case, even logged in user would get error.

This button (a) is opening modal dialog and loads static page ecard_form into it. So I cannot put "everything" inside of it.

thanks mnakalay, I hope we can find what went wrong here.
mnakalay replied on at Permalink Reply
Edit: Ignore this, it worked.

Hi, I don't know why, every time I try to post it just refuses to publish so I'm sending you the solution by pm
mnakalay replied on at Permalink Reply
Try this, it works on my computer.

1- replace your link
   dialog-title="Send your e-card" 
   href="http://solin-info.com/ecard_form"><div class="botun"></div></a>

<a id="goToMyPage" href="javascript:void(0)"><div class="botun"></div></a>

2- under the link add an empty div
<div id="ecardDialog"></div>

3- delete your javascript
<script type="text/javascript">$(function() { $("#ecardDialog").dialog(); });</script>

4- put this javascript in the head of your document, just before the closing </head>
<script type="text/javascript">
 $(document).ready(function() {
$('#goToMyPage').click(function() {
   var Url = "http://solin-info.com/ecard_form";
   $( "#ecardDialog" ).dialog({ 
         modal: true,
           autoOpen: false,
            height: '450',
            width: '700',
            draggable: true,
            resizeable: true,   
             title: 'Send your e-card' });
   $( "#ecardDialog" ).load(Url, function() {
      $( "#ecardDialog" ).dialog('open');
      return false;
eOne replied on at Permalink Reply
hi mnakalay,

thank you for your effort but I really don't know why it isn't working for me. I hope I did exactly as instructed but I get error after click:

Uncaught TypeError: Object [object Object] has no method 'dialog'

now it misbehave even in edit mode aswell ... it shows page but in very weird way ( not form at all )
mnakalay replied on at Permalink Reply
I checked, you are using an older version of concrete5 so it has an older version of jquery UI. I'm using C5 5.5.x.

What you should do is download the new version of Concrete5 and then you have 2 choices:

1- install it and use it but it might be time consuming.
2- in the new C5 go to the folder concrete/js and copy the files jquery.js and jquery.ui.js then paste them in the folder js (not concrete/js) of your older Concrete5.
Then try again.
Make sure you don't delete or replace any file.
eOne replied on at Permalink Reply
thank you mnakalay, this helped

if you check now you'll see it sort of works. It opened popup, it's dragable only it looks bit weird.
Should I take something more than those two ? maybe css ?
mnakalay replied on at Permalink Reply
yes definitely try the css as well
eOne replied on at Permalink Reply
did that too, copied it into css folder but it looked even worst :)

I should upgrade, but I am bit worried about all plugins I am using so I am not sure for that step yet :/

thank you man... if you have any more ideas please let me know
mnakalay replied on at Permalink Reply
are you sure you copied the file jquery.ui.css into the css folder? Because on your site it's still the one from concrete/css/ that's being loaded

Also I used chrome developper tool to try to replace the css with the good one and it works perfectly so I'm sure that's the solution.

You will need also need to copy the file ui-icons_222222_256x240.png from concrete/css/images in the newer version of Concrete5 to the folder css/images in your website.
eOne replied on at Permalink Reply
damn, now it worked :)

I did tried but got even worse look first time. Maybe problem with cache or something ...

now is OK, need to adjust sizes, but this is just fine!

tnx man!
mnakalay replied on at Permalink Reply
you're welcome. Every time I can help, I learn something so it's win-win.

two things though.
1- I made a mistake about the picture you need to use with the css, it should be icon_sprite.png so the little cross in the top right corner appears
2- You noticed that your youtube video is blocking the view by staying on top of the modal? Actually the problem is only in Chrome, not in Firefox or others, the youtube video gets on top of the modal. The solution is to have the url to your youtube video changes from


Meanwhile, could you mark my answer as best answer please, it might help others and it's good for my Karma :)
eOne replied on at Permalink Reply
Thanks man, I'll do that too.

Also, I already tried to make answer helpfull but I cannot find where to do it. I made whole thread helpfull.

Maybe I cannot do it as I didn't initiate question? Should we move this to new thread ?
mnakalay replied on at Permalink Reply
yeah you're right. well that's ok, you're happy, I'm happy, forget the karma :)
rockface replied on at Permalink Reply
I just fixed a related problem and thought i'd this might help you too...

The issue appears the c5 designers have chosen which script libraries to skip when no one is logged in. If i had to guess why...

1. Complex data entry is reserved for when a user is logged in
2. or maybe its just to reduce on load time.

Either why the solution is pretty simple...

public function on_page_view() {
   $html = Loader::helper('html');
   //Required for DatePicker (when not logged in)
   //Required for $('#x').dialog.open() (when not logged in)

The official C5 documentation is silent on this dependency:

Hope this helps!