Question

As mentioned in this link Disable link with the prototype observe method

If the link is disabled using the observe method how is it possible to enable it.

Thanks

Answer 1

Your best bet is probably to use a flag; alternately you can add and remove a handler. Or probably about 15 other ways. 🙂

Using a Flag

var link = /* ...get reference to link, e.g. $('the_links_id') or whatever */;
link.observe('click', function(event) {
    if (this.readAttribute("data-disabled")) {
        event.stop();
    }
});

// Disabling the link:
link.setAttribute("data-disabled", 1);

// Enabling the link:
link.removeAttribute("data-disabled");

That uses an attribute called data-disabled (using the data- prefix to be HTML5-compatible) which if present and truthy disables the link.

If you don’t mind sticking properties on element instances, you can do it without using an attribute:

var link = /* ...get reference to link, e.g. $('the_links_id') or whatever */;
link.observe('click', function(event) {
    if (this.disabled) {
        event.stop();
    }
});

// Disabling the link:
link.disabled = true;

// Enabling the link:
link.disabled = false;

Putting properties on element instances works in all popular browsers, but some people frown on it, hence using an attribute above.

Adding/Removing a Handler

// General purpose "stop the event" handler
function stopEvent(event) {
    event.stop();
}

// Disabling the link:
link.observe('click', stopEvent);

// Enabling the link:
link.stopObserving('click', stopEvent);