javascript - How to make the calendar image respect the disabled property? -

the below code disables , enables div (it disables 2 text boxes). problem facing cannot disable calendar popup (popup occurs on clicking calendar image). can still interact it.

javascript

function(){    var btnenabledisable = document.getelementbyid('enable-disable');   var divtwotextboxdiv = document.getelementsbyclassname('two-text-box-div');   btnenabledisable.onclick = function(){     if(btnenabledisable.value=='disable'){       btnenabledisable.value = 'enable';       enabledisablediv(true)     }else{       btnenabledisable.value = 'disable';       enbaledisablediv(false)     }   }    var enbaledisablediv = function(boolval){     for(var key in divtwotextboxdiv){       divtwotextboxdiv[key].disabled = boolval;     }   }  } 

html

<div class="two-text-box-div" id="div2" >   <table>     <tr>       <td>         <asp:label id="lblstartdate" runat="server" text="start date"></asp:label>       </td>       <td>         <asp:textbox id="txtstartdate"   runat="server" ></asp:textbox>         <asp:hyperlink id="hypcalenstart"  runat="server" imageurl="~/images/ico-cal.gif" ></asp:hyperlink>         <ajax:calendarextender id="startdatepicker" runat="server" popupbuttonid="hypcalenstart" targetcontrolid="txtstartdate"  selecteddate='<%# datetime.today() %>' format="mm/dd/yyyy">         </ajax:calendarextender>       </td>       <td>         <asp:label id="lblenddate" runat="server" text="end date"></asp:label>       </td>       <td>         <asp:textbox id="txtenddate"  runat="server"  ></asp:textbox>         <asp:hyperlink id="hypcalenend"   runat="server" imageurl="~/images/ico-cal.gif"  ></asp:hyperlink>         <ajax:calendarextender id="enddatepicker" runat="server" popupbuttonid="hypcalenend" targetcontrolid="txtenddate" selecteddate="<%# datetime.today() %>" format="mm/dd/yyyy">         </ajax:calendarextender>       </td>       <td colspan=2 align="center">         <asp:button id="enable" class="enable-disable-textbox"  onclientclick="validate(1);" runat="server" text="enable" />       </td>     </tr>   </table>         </div> <input type="button" value="disable" id="enable-disable"/> 

otherthan other disabled.