Supprimer la fonction Datepicker dynamiquement

Question

Je souhaite supprimer la fonction datepicker en fonction de la valeur sélectionnée dans la liste déroulante. J'essaie les codes suivants, mais il affiche toujours le calendrier lorsque je place le curseur dans la zone de texte. Merci de me faire une suggestion.

 $("#ddlSearchType").change(function () {
    if ($(this).val() == "Required Date" || $(this).val() == "Submitted Date") {
        $("#txtSearch").datepicker();
    } else {
        $("#txtSearch").datepicker("option", "disabled", true);
    }
});

Answer 1

Vous pouvez essayer les méthodes activer/désactiver au lieu d'utiliser la méthode option :

 $("#txtSearch").datepicker("enable");
$("#txtSearch").datepicker("disable");

Cela désactive toute la zone de texte. Vous pouvez donc peut-être utiliser datepicker.destroy() place :

 $(document).ready(function() {
    $("#ddlSearchType").change(function() {
        if ($(this).val() == "Required Date" || $(this).val() == "Submitted Date") {
            $("#txtSearch").datepicker();
        }
        else {
            $("#txtSearch").datepicker("destroy");
        }
    }).change();
});

Démo ici .

Answer 2

Détruisez l'instance du sélecteur de date lorsque vous ne le souhaitez pas et créez une nouvelle instance chaque fois que nécessaire.

Je sais que c'est moche, mais seulement cela semble fonctionner...

Regarde ça

  $("#ddlSearchType").change(function () {
        if ($(this).val() == "Required Date" || $(this).val() == "Submitted Date") {
                $("#txtSearch").datepicker();

         }
          else {
                $("#txtSearch").datepicker("destroy");                    
         }
 });

Answer 3

Il suffit de lier le sélecteur de date à une classe plutôt que de le lier à l'id . Supprimez la classe lorsque vous souhaitez révoquer le sélecteur de date...

 $("#ddlSearchType").change(function () { 
  if ($(this).val() == "Required Date" || $(this).val() == "Submitted Date")                   { 
    $("#txtSearch").addClass("mydate");
    $(".mydate").datepicker()
  } else { 
    $("#txtSearch").removeClass("mydate");
  } 
}); 

Answer 4

Eh bien, j'ai eu le même problème et j'ai essayé de "détruire" mais cela n'a pas fonctionné pour moi. Ensuite, j'ai trouvé le travail suivant autour Mon HTML était :

 <input placeholder="Select Date" id="MyControlId" class="form-control datepicker" type="text" />

Jquery qui fonctionne pour moi:

 $('#MyControlId').data('datepicker').remove();