Skip to main content

How to disable a calendar button....

When you disable a Datepicker field, you can still click the matching image next to that field and doing so will popup the calendar window.

You can easily get this functionality using jQuery:

$(function(){
$('td.datepicker input:text').each(function(){
var i=this.id;
$('#'+i+'_IMG').click(function()
{return (!document.getElementById(i).disabled);});
});
});

This function adds a click event to the Calendar image that will only return true - and therefore do something - if the date field is enabled. You can see how this works on apex.oracle.com.

Why doesn't APEX handle this by itself? I really don't know. Maybe they'll copy this solution (or similar) in the next version....

Comments

Anonymous said…
Roel,

Setting the field with a read only condition will not only make the field into a display only field but also removes the datepicker icon as well. So the functionality is already in APEX.

This also works for the JQuery datepicker that I have implemented thanks to your input.

Regards,

Jon
kavitha said…
HI Roels,
I am working for apex development,
2nd point, Add a click event to each datepicker image.
Could u please explain me more detail like where to add it????
Roel said…
Kavitha,

The function itself adds a click event to the image. You don't have to do anything. Just copy and paste the code in your Page HTML Header (and incorporate jQuery of course).

Roel
kavitha said…
Hi Roels,
Thanks for your reply.
Please tell me how to incorporate jQuery??.

Thanks
Roel said…
Hi Kavitha,

See this post
kavitha said…
Hi Roels,
Thanks for the link..
the same code, with little change,
$(function(){
$('td.lov input:text').each(function(){
var i=this.id;
$('#'+i+'_IMG').click(function(){return (!document.getElementById(i).disabled);});
});
});

i use for disabling the popup lov but it was not comming.
Please, am i doing anything wrong ?

kavitha
Roel said…
Kavitha,

Check in your "each" function if the right items are selected.
So does i have a (correct) value? And does the IMG item (i+'_IMG') actually exists?
Wolfgang said…
Hi Roels,

do you have a solution that works with APEX 4.0 (4.0.2) too?

Regards,
Wolfgang
Roel said…
Hi Wolfgang,

The example runs on apex.oracle.com. And that's running apex 4.0.2. So it is working in the latest version of apex.
But in the latest version you probably would use Dynamic Actions to get the same result (without any coding). See the updated example:
Created a (Standard) Dynamic Action on the radio group; if the value = 'Y' (Disable) then Disable the date otherwise enable.
So that's the way you should do it nowadays!

Roel