2016-11-22 3 views
0

Was ich versuche zu tun ist, nach der Auswahl eines Datums auf Bootstrap Datetimepicker, sollte es einen Wert auf meinem Eingabefeld laden, aber ich weiß nicht, wie das geht. Da ist meine JSFiddle.Datum in Eingabefeld laden nach Auswahl von Bootstrap datetimepicker

Dies ist meine jQuery für datetimepicker

$(function() { 
    $('.datetimepickerinline').datetimepicker({inline: true}); 
}); 

Ich brauche es für alle Eingänge zu verwenden, oder in anderen Worten, die am nächsten Eingabefeld.

Antwort

1

Hier Lösung Sie wollen: jsfiddle

$('.datetimepickerinline').on('change dp.change', function(e){ 
    $('input').val($(this).data('date')); 
}); 

Siehe Referenz here

Weiter mehr, bemerkte ich, dass Sie verwenden möchten moment.js

Sie können so etwas wie diese, benutzerdefinierte Format:

$('.datetimepickerinline').on('change dp.change', function(e){ 
    $('input').val(moment($(this).data('date')).format('DD/MM/YYYY, h:mm')); 
}); 
+0

Thanks man :) Funktioniert einfach schön :) –

+0

Sie sind willkommen! –

+0

Wenn ich mehrere Eingänge habe, addiert es zu allen Eingängen Wert. Wie ändere ich das? –

1

Sie müssen die Klasse 'datetimepickerinline' in Ihrem Eingabefeld anwenden.

<input id="" placeholder="press to show calendar" class="input datetimepickerinline"> 

diese Geige Versuchen: - https://jsfiddle.net/ekm0on2a/11/

1

Sie datepicker-Klasse im Eingabefeld hinzufügen müssen.

 <link rel="stylesheet" type="text/css" media="screen" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" /> 
     <link href="//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/build/css/bootstrap-datetimepicker.css" rel="stylesheet"> 

     <script type="text/javascript" src="//code.jquery.com/jquery-2.1.1.min.js"></script> 
     <script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> 
      <script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.js"></script> 
      <script src="//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/src/js/bootstrap-datetimepicker.js"></script> 

<div id="container"> 
<div class="my-example"> 
    <input id="datepicker" placeholder="press to show calendar" class="input input-datepicker"> 
    <div class="dropdown"> 
    <div class="datetimepickerinline"> 
    </div> 
</div> 
</div> 

</div> 

// Skript

$(function() { 
    $('#datepicker').datetimepicker({inline: true}); 
}); 
2

Sie rief so viele unerwünschte Bibliotheken. Probieren Sie einfach diesen Bootstrap-Datapicker. Hoffe, diese Arbeit für dich.

$(document).ready(function(){ 
$('#datepicker').datepicker({ 
    format: 'dd/mm/yyyy', 
    autoclose: true, 
    todayHighlight: true, 
    forceParse: false, 
    }); 
}); 

demo

Verwandte Themen