Skip to main content

Bug Tracker

Side navigation

#3454 closed enhancement (invalid)

Opened October 06, 2008 08:52PM UTC

Closed October 07, 2008 02:00PM UTC

Need a ready() event for page elements

Reported by: vlucas Owned by:
Priority: major Milestone: 1.3
Component: event Version: 1.2.6
Keywords: events, ready Cc: vlucas, flesler
Blocked by: Blocking:
Description

I think there is a real need for a "ready" event that can be applied to elements with selectors, kind of like the "load" event that can be. The problem with using "load" - as the manual states - is that you have to use it *before* the element in the HTML source order or it won't work. There is a need for a "ready" event for individual elements that would be especially useful when combined with other events like "click" or "change".

Example:


<< element >>

$('#selectBox').bind('ready change', function() { doSomething(this); });

function doSomething(jqEl) {
    if(jqEl.val() == "blah") {
        $('#myDiv').show();
    } else {
        $('#myDiv').hide();
    }
}


There are cases where an option may be pre-selected (especially when correcting validation errors), but the doSomething() event will not be fired when the page is loaded (In this case, resulting in the '#myDiv' element not displaying when it needs to). There are also times when it's not possible to output the javascript *before* the element, like if it's being put together dynamically from a database and you want to output all the javascript together instead of having it strewn everywhere just before every element that needs it. A "ready" event would be a much more elegant solution, and would reduce the amount of code required to produce the same result otherwise.

Example:


<< element >>

doSomething($('#selectBox')); // extra code for element load/ready
$('#selectBox').bind('change', function() { doSomething(this); });

function doSomething(jqEl) {
    if(jqEl.val() == "blah") {
        $('#myDiv').show();
    } else {
        $('#myDiv').hide();
    }
}


So in this case, redundant code must be produced when the javascript cannot be output before the actual element in the HTML source. A simple "ready" event for elements would eliminate the need for the extra repetitive code.

Attachments (0)
Change History (1)

Changed October 07, 2008 02:00PM UTC by flesler comment:1

cc: → vlucas, flesler
component: coreevent
resolution: → invalid
status: newclosed

While I understand the test case, there's no logic for the 'ready' event. It's just an execute-right-away.

You simply do that with each:

function doSomething() {
    if( this.value == "blah" )
        $('#myDiv').show();
    else
        $('#myDiv').hide();
}
$('#selectBox').change(doSomething).each(doSomething);

BTW, note the your example doesn't work. doSomething(this) passes a dom element.