Ich bin gezwungen, eine ältere Version von jquery ui zu verwenden, die 1.8.10 ist. Der Datapicker in dieser Version hatte einen Bug innerhalb der Z-Index-Einstellung, der ihn manchmal unter anderen Steuerelementen erscheinen ließ. Ich möchte einfach den Z-Index des dp so einstellen, dass es über den anderen Kontrollen erscheint. Ich habe versucht, den Z-Index in die JS-Datei zu ändern, aber das ist fehlgeschlagen. Ich habe gelesen, dass Sie diesen Wert auf das Ereignis aftershow setzen müssen, da der Wert überschrieben wird, wenn er früher ist (nicht sicher, ob das wahr ist). Hier ist ein Beispiel dafür, wie ich eine Instanz von dp erstellen kann ... Ich habe auch einen Zeitpicker an den Datumsauswahlpunkt angehängt.
%Vor% Sie müssten Stile auf die Klasse ui-widget-content
anwenden
Stellen Sie sicher, dass die Klasse mit bessere Spezifität hinzugefügt wurde, damit sie die UI styles
Sieht aus wie datepicker, kopiert den Z-Index-Wert, den Ihr ursprüngliches Eingabeelement hat. Ich kann mir zwei Möglichkeiten vorstellen, dies zu lösen:
Nicht-JS
Fügen Sie einfach z-index:1051;
zum style-Attribut Ihres Eingabeelements hinzu. Dies basiert auf der Beobachtung, dass bootstrap .modal
class einen z-index von 1050 verwendet.
Dynamische Lösung mit JS
Wenn Sie Ihren Datepicker deklarieren, fügen Sie einen beforeShow-Handler hinzu, der den z-index von .modal
abruft und den z-index von datepicker auf 1 höher als den folgenden setzt:
Ändern Sie einfach das CSS:
Wie zuvor:
%Vor% Vergessen Sie nicht, !Important
hinzuzufügen.
Dies überschreibt jedes Inline-Styling, das von javascript
hinzugefügt wird.
hoffe, das wird funktionieren :)
Glückliche Kodierung
Tags und Links jquery css jquery-ui jquery-ui-datepicker jquery-ui-timepicker