Bootstrap Datepicker (évitez la saisie de texte ou restreignez la saisie manuelle)

Voici mon site web: http://splash.inting.org/wp/

J'utilise actuellement la Bootstrap Datepicker (plage de branche) pour ma Date de champ et c'est génial.

Bien que j'ai 2 Problèmes:

1) Vous pouvez saisir manuellement les chaînes de caractères dans le champ de saisie. C'est bizarre depuis le original par eyecon rejetée en entrant la date actuelle chaque fois que vous entrez les non-valeurs de date. J'ai essayé l'attribut lecture seule et il ne semble pas fonctionner, car il ne vous permet pas de sélectionner n'importe quelle date.

2) j'ai limité la date d'entrée de choix pour les mardis et jeudis par la modification d'une réponse dans un autre post. Après le chargement du datepicker, par défaut, la date retenue est la date actuelle, qui peut être n'importe quel autre jour de la semaine. Je veux éviter cela et n'ont que soit le mardi ou le jeudi sélectionnés.

source d'informationauteur AnimaSola

  1. 78

    Remplacer les événements importants du contrôle d'entrée.

    <input onkeydown="return false" ... />
  2. 4

    J'ai réussi à obtenir solution acceptable comme suit:

    $(".date").datetimepicker({
    defaultDate: moment(),
    format: 'YYYY-MM-DD'
}).end().on('keypress paste', function (e) {
    e.preventDefault();
    return false;
});

    Espère que ça marchera pour vous aussi!

  3. 3

    Utiliser l'attribut lecture seule et ajouter un add-on après l'élément d'entrée pour déclencher le datepicker après l'entrée:

    <input type="text" name="CallDate" value="" id="CallDate" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required input-medium date date-pick" size="40" readonly>
<span class="add-on"><i class="icon-calendar"></i></span>

    qui devrait fonctionner.

    Pour le deuxième problème, vous pouvez utiliser une version modifiée de la datepicker à partir d'ici:
    https://github.com/eternicode/bootstrap-datepicker et utiliser l'option daysOfWeekDisabled

  4. 1

    Utilisation onKeyDown attribut comme ci-dessous. Il travaille pour moi [Pour Limiter la saisie manuelle dans datepicker]

      <input type="text" id="signedDate" name="signedDate" 
  onkeydown="event.preventDefault()" class="form-control input-med datepicker" 
  maxlength="10" placeholder="" />