5.4.0RC1 feature to avoid page reload could be a problem sometime

Permalink
Hi,
the new feaure for adding/editing of blocks, updating page properties and more using AJAX, without a page reload could be a problem in visualization when one is using dynamic height for div layers.

Example: on page load, I call a script to check the height of the div layers containing the main content and to store this value in a variable. Then assign it to the left side bar div height so it is forced to be exactly of the same size as the main content. That's because the structure does not permit these divs to be dependant each other in different ways.
Also the footer is positioned with this value.
Now, with the 5.4.0RC1 when I add a new block (or edit an existing one) if the height of the main content is changing, when I save the editing, the page is updated without reload and it doesn't know the new height of the layer. So, the divs overlap. The user must reload the page manually.

Can developers please add a switch to send an optional page reload request with the ajax querystring?

I will be not the only one to have this problem.
Thanks.

digitmaster
 
digitmaster replied on at Permalink Reply
digitmaster
BUMP!

Does enyone??

Is it fixed with the 5.4.0 final release?
andrew replied on at Permalink Reply
andrew
We are now loading both javascript and css dynamically through the ajax, so in theory this could be fixed in 5.4 now (while it wasn't working in 5.4rc1)
digitmaster replied on at Permalink Reply
digitmaster
Thank you Andrew.
Unfortunately, if you figure it out that I'm calling the javascript in:

<body onload="myfunction();">

you can better understand my problem.
The point is to reload the page after the insert of a new block.
I know that it would downgrade the ajax quality but for all those who will implement a function calling in the "body onload" event it will not work.
[ gimme just a little small switch :(]

If you have any suggestion I thank you in advance.
ScottC replied on at Permalink Reply
ScottC
did you try $(myfunction());

inside a script tag?

basically that says when the document is ready then it fires that event passing the function in as a constructor to the jquery object.

I think?
digitmaster replied on at Permalink Reply
digitmaster
Thanks ScottC,
you mean "inside the caller event"...
and I never mention jquery.
Just a pure, simple, personal, small script and no ajax or libraries.

this is my script tag:

<script type="text/javascript" src="<?=$this->getThemePath()?>/script/divlen.js"></script>

myfunction() is inside the divlen.js
I call it this way:

<body onload="myfunction();">

I've tried as you suggest, but it doesn't solve the problem.

<body onload="$(myfunction());">

But I really appreciate your post.
Again thanks.
Any other suggestions?
digitmaster replied on at Permalink Reply
digitmaster
I confirm that is yet not possible to make it work on 5.4.0
Remo replied on at Permalink Reply
Remo
why aren't you using the correct jquery way? Did I miss something in this discussion?

<script type="text/javascript">
$(document).ready(function() {
 alert('sdf')
});
</script>


I would try to avoid using the onload attribute as this will always cause troubles when using javascript libraries (not only jquery)
digitmaster replied on at Permalink Reply
digitmaster
Thanks Remo,

I migrated the function to document.ready jquery mode.
Again, it is functional (on the first page load) but doesn't reloaded after added (or removed) a block.

I'll not migrate this website to the 5.4.0.
All is ok on 5.3.3.1 where the page is reloaded at every modification. It will stay there.

But very sad.

I'll update this post if I'll find a solution.
Thanks for help.
Remo replied on at Permalink Reply
Remo
I'm not sure if I really understand your problem but whenever a web application uses ajax you can't rely on onload or document.ready.

If you post your block here I'd certainly have a quick look at it..

Update: If you want to execute your javascript when a new block has been added, try to look if there's a javascript method in the core you can override, but don't expect to be able to use onload or anything like that. Having a switch which would call the onload method a second time when a block has been added is a bad idea as it could mess up lots of things. It might be possible to have an official "hook" for javascript updates, but nothing else.. If there isn't already one..
andrew replied on at Permalink Reply
andrew
I guess I'm still confused by this - i know why the document.write won't work (it just doesn't work with the DOM being loaded in this way) but we have lots of blocks which, when using the new AJAX edit mode, display just fine and use javascript extensively. The slideshow, etc...
Shotster replied on at Permalink Reply
Shotster
Are you saying that the JS is not being executed or that the div height is not changing as you expect? If the latter, perhaps you should dispense with storing the div height in a variable. Depending on where that variable is declared, it might not be visible to the embedded script in the ajax response. Instead, just dynamically set the sidebar height to the div height.

I had a similar concern as per this post...

http://www.concrete5.org/community/forums/customizing_c5/5-4-block-...

I can vouch for the fact that JS is in fact being executed after a block edit in 5.4.0. My code is in an embedded script in the block's view.php.

-Steve
digitmaster replied on at Permalink Reply
digitmaster
Dear all,
apologize to be in late but I had terrible troubles at work.

So, here's the code that I've converted to document.ready sintax.
*It is not in a block!* I've applyed the code to the whole page.

It works but it's not reloaded after editing any block (e.g content).
______________________________
CONTENT OF THE myscript.js FILE:
$(document).ready(function() {
      var divHeight = (document.getElementById('central_content').offsetHeight) +40;
      if (divHeight < 300){
         document.getElementById('divcentral').style.height = 370 +'px';
         document.getElementById('leftcol').style.height = 370 +'px';
         } 
         else 
         {
         document.getElementById('divcentral').style.height = divHeight +'px';
         document.getElementById('leftcol').style.height = divHeight +'px';         
                                    }
         document.getElementById('footer_natur').style.visibility = 'visible';                           
});
digitmaster replied on at Permalink Reply
digitmaster
A little, just a little Bump!
And I'm close to be sure at 99% to not, never, migrate from the 5.3.3.1. I'll stay on this version but just only for that existing websites or the future ones that will need this kind of feature like dynamic div size.

But I'll always love concrete5 - for 105 concrete reasons.