Link to home
Start Free TrialLog in
Avatar of Tom Knowlton
Tom KnowltonFlag for United States of America

asked on

datepicker - prevent a textbox click from invoking the pop-up calendar

I have a datepicker control that is implemented via jQuery.

When you click on the text box control OR the calander icon image, the calendar pops up.

I want to make it so that ONLY the calendar icon image is clickable.  Clicking on the text box should NOT invoke the calendar popup.

I tried setting "disabled" to true on mouseenter, but then I don't seem to be able to click the calendar image icon when I do that.

Here is a jsfiddle:

Sample 1:
date picker popup



Sample 2:
Here is the control as it currently functions

Notice that in Sample 2, clicking on the "clear" command DOES clear out the value of the input tag, but then for some reason the calendar pop up invokes.  I don't want the calendar to pop-up.  I just want to clear the text input value.

But when I click elsewhere to make the calendar pop up go away --  the date value comes back!!!!
Avatar of zephyr_hex (Megan)
zephyr_hex (Megan)
Flag of United States of America image

Can you share what your end goal is with preventing the pop up to show when the textbox is clicked?  What are you trying to achieve or prevent?
Avatar of Tom Knowlton

ASKER

Desired functionality:

When the user clicks on the "text box" portion, nothing happens.

When the user clicks on the "calendar icon" (to the right of the text box) the calendar pops-up.

When the user clicks on the "clear" button, the date value is set to ""
ASKER CERTIFIED SOLUTION
Avatar of zephyr_hex (Megan)
zephyr_hex (Megan)
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
I am going to see if I can take your fiddler example and reskin it to look like Sample 2.

Thank you.