Bootstrap Datepicker funktioniert nicht in Chrom

Ich benutze ein Jquery-Plugin Bootstrap Datepicker. Es funktioniert gut in Firefox. Es funktioniert auch auf einigen Seiten meiner Website in Google Chrome (Version 33.0.1750.117 m). Es gibt jedoch eine Texteingabe (Name = "TravelDate"), wo dieses Plugin nicht funktioniert. Diese Texteingabe wird im modalen Bootstrap-Fenster platziert.Bootstrap Datepicker funktioniert nicht in Chrom

<script> 
$(function() { 
    $("#date-trip").datepicker({ 
     format: "dd.mm.yyyy", 
     startDate: new Date(), 
     todayBtn: "linked", 
     language: "ru", 
     autoclose: true 
    }); 
}); 
</script> 

<!-- Modal --> 
<div class="modal fade" id="createTripModal" tabindex="-1" role="dialog" aria-labelledby="createTripModalLabel" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
       <h4 class="modal-title">Travel creating</h4> 
      </div> 

      @using (Html.BeginForm("Create", "Trip", new {ReturnUrl = ViewBag.ReturnUrl}, FormMethod.Post, new {@class = "form-horizontal", role = "form"})) 
      { 
       @Html.AntiForgeryToken() 

       @Html.ValidationSummary(true) 
       <div class="modal-body"> 
        <label for="date-trip">Date:</label> 
        <input name="TravelDate" type="text" id="date-trip" class="form-control" required autofocus /> 
       </div> 
       <div class="modal-footer"> 
        <input type="submit" value="Create" class="btn btn-primary" /> 
       </div> 
      } 
     </div><!-- /.modal-content --> 
    </div><!-- /.modal-dialog --> 
</div> 
<!-- /.modal -->

Es gibt keine Fehler in der Konsole in Google Chrome. Es ist wichtig, dass dieses Plugin auf anderen Formularen korrekt funktioniert.

Ich freue mich auf jeden Hinweis.

Quelle

2014-03-01 Denis

Ich benutze Version 1.6.0 des gleichen Plugins und es funktionierte nicht in Chrome. Für mich war die Ursache eine alte Version von jQuery. Wenn jemand diese Frage findet und die folgenden Antworten nicht funktionieren, versuchen Sie, jQuery zu aktualisieren. – Nick

Ich behebe einen Fehler. This post hat mir geholfen. Ich änderte diese Zeile in einem Code-Plugin (10 -> 1151):

var zIndex = parseInt(this.element.parents().filter(function() { 
          return $(this).css('z-index') != 'auto'; 
         }).first().css('z-index'))+1151;

Quelle

2014-03-01 11:14:58 Denis

Bitte verwenden Sie diesen CSS in Ihrem Code picker in Chrome zu zeigen:

<style>.datepicker{z-index:1200 !important;}</style>

Quelle

2015-07-24 10:44:22

Watch out <input type="date"....> mit - Neuere Versionen von Chrome haben eine eigene Datumsauswahl für das Feld html5-input type "date", das den Bootstrap 3-Datumsauswahlpunkt beeinflusst. Verwenden Sie stattdessen <input type="text"....>.

Quelle

2015-09-15 22:30:58

Bootstrap Datepicker funktioniert nicht in Chrom

Antwort

Verwandte Themen