Bootstrap-Datetimepicker Nicht funktioniert
Ich schaue mir das seit 2 Tagen, und kann nicht herausfinden, was ich falsch mache.
Hier ist ein Turnschuh mit meinem Projekt. http://jsfiddle.net/dagger2002/RR4hw/
Hier ist der HTML -
<div class="container">
<div class="col-sm-6" style="height:75px;">
<div class='col-md-5'>
<div class="form-group">
<div>Start</div>
<div class='input-group date' id='startDate'>
<input type='text' class="form-control" name="startDate" />
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
<div class='col-md-5'>
<div class="form-group">
<div>End</div>
<div class='input-group date' id='endDate'>
<input type='text' class="form-control" name="org_endDate" />
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
</div>
</div>
Hier ist die Jquery.
jQuery(function () {
jQuery('#startDate').datetimepicker();
jQuery('#endDate').datetimepicker();
jQuery("#startDate").on("dp.change",function (e) {
jQuery('#endDate').data("DateTimePicker").setMinDate(e.date);
});
jQuery("#endDate").on("dp.change",function (e) {
jQuery('#startDate').data("DateTimePicker").setMaxDate(e.date);
});
});
Erhalte ich keine Fehler und wenn ich es durch fiddle es sagt keine Fehler gefunden. Ich bin neu in jQuery, so bin ich nicht sicher, was ich falsch mache.
Oh yeah. Ich benutze lange Namen tun, um diese in eine joomla-Website, die ist auch mit moo tools.
Vielen Dank im Voraus.
UPDATE
<!doctype html>
<html lang="en-gb">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="x-ua-compatible" content="IE=edge,chrome=1" />
<title>DateTime Test</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<!-- Style Sheets -->
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.min.css" type="text/css" />
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" type="text/css" />
<!-- Scripts -->
<script src="//ajax.googleapis.com/ajax/libs/mootools/1.3.0/mootools-yui-compressed.js"></script>
<script src="https://code.jquery.com/jquery-1.11.0.min.js" type="text/javascript"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.min.js" type="text/javascript"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js" type="text/javascript"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.5.1/moment.min.js" type="text/javascript"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/3.0.0/js/bootstrap-datetimepicker.min.js" type="text/javascript"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.4.0/lang/en-gb.js" type="text/javascript"></script>
<script>
jQuery.noConflict();
//Code that uses other library's $ can follow here.
</script>
</head>
<body>
<div class="container">
<div class="col-sm-6" style="height:75px;">
<div class='col-md-5'>
<div class="form-group">
<div>Start</div>
<div class='input-group date' id='startDate'>
<input type='text' class="form-control" name="startDate" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
<div class='col-md-5'>
<div class="form-group">
<div>End</div>
<div class='input-group date' id='endDate'>
<input type='text' class="form-control" name="org_endDate" />
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Diese jFiddle funktioniert. http://jsfiddle.net/RR4hw/11/
Aber wenn ich die Integration in eine normale Seite, die Sie bricht. Nicht sicher, was ich vermasselt.
Vielen Dank im Voraus.
InformationsquelleAutor dagger2002 | 2014-04-03
Du musst angemeldet sein, um einen Kommentar abzugeben.
Schien es einige Probleme mit der externen Ressourcen in der jsFiddle.
Habe ich aktualisiert jsFiddle zu arbeiten. Ich habe die externen Ressourcen und einige kleinere Anpassungen am code.
HTML
JAVASCRIPT
UPDATE
Aktualisiert jsFiddle mit funktionierenden Lösung.
Ich habe verschiedene URLs von dem, was Sie hatte. gleiche Dateinamen, aber unterschiedlichen urls.
Vielen Dank für die Hilfe. Ich erkannte, dass Sie es geändert von bootstrap 3.1, bootstrap 2.2. Das wird nicht funktionieren, da meine Website ist mit bootstrap 3. Der Zeit-Skript-version, ich war mit arbeiten mit bootstrap 3.
Ich endlich das problem gefunden. Ich werde zu aktualisieren, die Antwort...
Ich kann es immer noch nicht, dass es funktioniert. Außerhalb der jFiddle. Ich will update-Code oben.
InformationsquelleAutor malkassem
Skript enthalten, um in jsFiddle funktioniert nicht, unten ist die geänderte Ordnung für brauchbare Probe. Vorgeschlagen von @malkassem moment.js erforderlich ist für die bootstrap-Datum-picker arbeiten.
InformationsquelleAutor Jeevanantham
Einfachste Weg, um Datum und/oder Uhrzeit auswählen zu arbeiten, ist die Installation unter Paket
und klicken Sie dann verweisen Sie installierten Dateien in _Layout
und fügen Sie dann unterhalb der Skript der layout-Seite vor
</body>
tagin Razor-Ansicht verwenden, wie unten
InformationsquelleAutor Moji