CODEWITHSUNDEEP
javascriptjqueryasp.net
mdt
mdt

Reputation: 139

disable DatePicker when asp:Textbox disabled

I have an asp:Textbox 

<asp:TextBox ID="txtDate" runat="server" ReadOnly="false" />

I added a datepicker using jQuery

<script type="text/javascript">
function Bind() {
 $('#<%=txtDate.ClientID %>').datepicker({
                dateformat: 'MM/dd/yyyy',
                minDate: '01/01/1947',
                maxDate: 0,
                showOn: 'button',
                buttonImage: '../../images/Calendar_scheduleHS.png',
                buttonImageOnly: true,
                buttonText: ''
            }).mask('99/99/99?99', { placeholder: ''
            }).change(function () {
               dateComplete('<%=txtDate.ClientID %>', false, 'The Date cannot be a future date.', 'Date of Contact', $('#<%=hidSavedInteractionDate.ClientID %>').val(), $('#<%=lblNumber.ClientID %>').text(), '<%=txtDate.ClientID %>');
            });
}

</script>

 <script type="text/javascript">
        Sys.Application.add_load(Bind);
 </script>

I disabled the asp:Texbox in the behind code vb.net

txtDate.ReadOnly = True
txtDate.Enabled = False

I want the datepicker to be disabled a well. I tried this bellow, but it didn't work.

behind code vb.net:

ClientScript.RegisterStartupScript(Me.GetType, "HideDate", "HideDate();", True)

Jquery:

<script type="text/javascript">
HideDate() {

    if (disabled == true) {
        $("#txtMyTextBox").datepicker('disable');
    }
    else {
        $("#txtMyTextBox").datepicker('enable');
    }


}
 </script>

On a side note, I used this bellow and it did disable the datepicker, but it disables it whether the asp:Textbox is disabled or not. I want the datepicker to be disabled only when the asp:Textbox is disabled.

<script type="text/javascript">
$(function () {

        if (disabled == true) {
            $("#txtMyTextBox").datepicker('disable');
        }
        else {
            $("#txtMyTextBox").datepicker('enable');
        }


    });
    </script>

Upvotes: 2

Views: 3500

Answers (2)

mdt
mdt

Reputation: 139

Sunil's answer is helpful, but I did this with a more simple solution.

I added this to jQuery code where I initialized the datepicker:

 if ($('#<%=txtDate.ClientID %>').prop("disabled")) {
                $('#<%=txtDate.ClientID %>').datepicker("option", {disabled:true});
            }

Upvotes: 2

Sunil Jatolia
Sunil Jatolia

Reputation: 41

Change your JavaScript to: 

<script type="text/javascript">
   DisableDate() 
     { $('#<%=txtDate.ClientID %>').datepicker('disable'); }

   EnableDate() 
     {  $('#<%=txtDate.ClientID %>').datepicker('enable');  }
</script>

Then in the code behind, to disable the datepicker call:

txtDate.Enabled = False
ClientScript.RegisterStartupScript(Me.GetType, "DisableDate", "DisableDate();", True)

To enable the datepicker call:

txtDate.Enabled = True
ClientScript.RegisterStartupScript(Me.GetType, "EnableDate", "EnableDate();", True)

Upvotes: 2

Related Questions