Comments on: Cleanest way of executing javascript code on page load

By: Anonymous

Anonymous — Mon, 17 Oct 2011 00:38:00 +0000

I stumbled on this page via Google search and reading the comments it sounds like this is a smart group. I’m a complete newbie to Javascript, AJAX, and PHP and I’m trying to figure out a way of passing on a data-value to a page when it loads and then use that data-value with a javascript that runs when the page loads.

I bought a WordPress template that the author stopped supporting and I need to find a solution to this problem. If you go to http://www.stevenmichaeloconnor.com/series I am trying to get it so that if someone clicks on a Series Name such as “Assorted” it would go to the Portfolio page and then execute the javascript that the category menu is using and pass along the data-value=”assorted”.

This is the a href that the category menu is using on the Portfolio page to show only the “Assorted” category:
[code]Assorted[/code]

I would be very grateful if anyone can help me out with this!

By: Leo

Leo — Wed, 11 Aug 2010 01:02:48 +0000

How about just moving the javascript to the bottom of the page?

By: anthony

anthony — Tue, 30 Jun 2009 06:12:01 +0000

Creating a custom EPiServer property is relatively easy – although I think I’ve not quite got the hang of how to store the actual data. It must be converted to a string for storage in the database. I started to use an XmlSerializer but got confused (mainly as the JavaScript was doing my head in) as to where i should be doing the serialisation. Sadly the only example i could find on the net was how to create a custom property that was a string – about as much use as a chocolate fire guard! So here’s my way of doing it – using a comma separated string (dirty I know!) – please feel free to show me the correct way.
http://www.casinoszocken.de/

By: Trygve Lie

Trygve Lie — Thu, 11 Jun 2009 23:46:20 +0000

Interesting. I’ve been dealing with the same issue in a project which interac heavy with the DOM. I’ve got some limitations in this project which prevents me from using any of the JS libraries out there (so the “ready” function in JQuery are out of the question) and easy injection into a document is a must.

I ended up writing a small bootstrap script for javascript functions.

The bootstrap has a array intended to hold functions. Then there is a small “load” function which attach itself to “DOM readyness” and run trought the array of functions and fire the functions in it’s order in the array when the DOM is ready. For the “DOM readyness” detection I use the DOMContentLoaded which are supported in most new sane browsers and a small “hack” (http://javascript.nwbox.com/IEContentLoaded/) for detecting the same “DOM readyness” in IE. This way of detecting “DOM readyness” is pretty much the same way as JQuery and other JS libraries do.

I did post the bootstrap script with documentation, examples and the source a couple of weeks ago: http://www.trygve-lie.com/blog/entry/bootstraping_javascript

By: cancel bubble

cancel bubble — Tue, 03 Mar 2009 18:01:09 +0000

There’s an even shorter alternative with jQuery:

$(function() {
// your code here
});

By: Learning jQuery

Learning jQuery — Fri, 26 Dec 2008 14:57:31 +0000

There is a shorthand alternative to $(document).ready(); Use this shortcut:

jQuery(function(){
// your code here
});

By: Maicon Peixinho

Maicon Peixinho — Thu, 11 Dec 2008 11:48:10 +0000

There are other ways that do not require a specific framework for this, such as the function addLoadEvent () “, which is added some methods in the page when all the elements are loaded.

Example:

Excuse me shift the focus on the topic, but does not taste much of jquery, and therefore, shared a bit of a different note.

Thank you.

By: Dan

Dan — Mon, 08 Dec 2008 18:34:46 +0000

@Rick F
Thanks, I think that it’s exactly what I was searching for. I’ll try it and write a post about.

By: Rick F

Rick F — Mon, 08 Dec 2008 16:08:08 +0000

Have a look at the jQuery plugin “LiveQuery”. I think it covers some of the cases you mention here.

http://plugins.jquery.com/project/livequery

By: DevelX

DevelX — Wed, 03 Dec 2008 16:13:48 +0000

Hm, well… I prefer this way:
if (document.addEventListener !== undefined) {
document.addEventListener(‘load’, init, false);
} else {
document.attachEvent(‘onload’, init);
}
This way you cannot make a collision with other scripts using document.load and such. But, well, you need to wait until all images etc are loaded.
But for the specific usage you need seems pawel’s script good enough.