ブートストラップdatetimepickerにデフォルトの日付を設定する方法

Question

datetimepickerに現在の日付であるデフォルト値を設定します。どうすればこれを達成できますか？私はすでにドキュメントを読みましたが、それを達成するための何かを見つけることはできません。誰か助けてくれますか？私はデフォルト値のフォーマットがMM dd, yyyyであることを望みます。

ここに私のコードです。

<div class="form-group"> 
    <label for="dtp_input2">Date</label> 
    <div class="input-group date form_date col-md-3" data-date="" data-date-format="MM dd, yyyy"> 
    <input id="dtp_input2" name="date" class="form-control" size="10" type="text" value="" readonly> 
    <span class="input-group-addon"> 
     <span class="glyphicon glyphicon-remove"></span> 
    </span> 
    <span class="input-group-addon"> 
     <span class="glyphicon glyphicon-calendar"></span> 
    </span> 
    </div> 
</div> 

$('.form_date').datetimepicker({ 
    weekStart: 1, 
    todayBtn: 1, 
    autoclose: 1, 
    todayHighlight: 1, 
    startView: 2, 
    minView: 2, 
    forceParse: 0, 
}); 

Answer 1

だけのDateTimePickerを設定した後、値を設定します。

$('.form_date').datetimepicker({ 
    weekStart: 1, 
    todayBtn: 1, 
    autoclose: 1, 
    todayHighlight: 1, 
    startView: 2, 
    minView: 2, 
    forceParse: 0, 
}); 
$('#dtp_input2').val(Date()); 

Answer 2

はDateTimePickerのをインスタンス化するときにdefaultDateを設定することができますdocumentationからのように見えます。

$(function() { 
    $('#datetimepicker5').datetimepicker({ 
     defaultDate: "11/1/2013", 
     disabledDates: [ 
      moment("12/25/2013"), 
      new Date(2013, 11 - 1, 21), 
      "11/22/2013 00:53" 
     ] 
    }); 
}); 

Answer 3

のようにまた、JSのテキストフィールドに現在の日付を設定することができます。このソリューションは唯一のブートストラップのDateTimePickerが提供するメソッドを使用しています

var d = new Date(); 
 
document.getElementById("target").value = d.toDateString();

<input type="text" id="target">

Answer 4

。

あなたが行ったように、あなたのDateTimePickerを宣言してから、この操作を行うことができます。

$('#datepicker input').datepicker('setDate', new Date()); 
$('#datepicker input').datepicker('update'); 
$('#datepicker input').val(''); 

この方法を使用すると、setDate()で設定した日付がselectionnedされ、入力が空のままになります。

$('#datepicker input').datepicker('update'); 
$('#datepicker input').val(''); 

をし、その溶液を用いて再生する場合： あなたが入力が空にしたくない場合は、単にこれらの行を削除するここでjsFiddle

---

$('#datepicker input').datepicker({ 
 
    weekStart: 1, 
 
    todayBtn: 1, 
 
    autoclose: 1, 
 
    todayHighlight: 1, 
 
    startView: 2, 
 
    minView: 2, 
 
    forceParse: 0, 
 
}); 
 

 
$('#datepicker input').datepicker('setDate', new Date()); 
 
$('#datepicker input').datepicker('update'); 
 
$('#datepicker input').val('');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script> 
 
<link href="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker3.css" rel="stylesheet"/> 
 

 
<div id="datepicker"> 
 
    <input type="text" type="text" class="form-control" /> 
 
</div>

です

Answer 5

私の場合： このdefaultDate: new Date()コードをJavaScriptの日付に挿入してくださいタイムピッカー。

<script type="text/javascript"> 
$(function() { 
    $('#datetimepicker10').datetimepicker({ 
     defaultDate: new Date(), 
     viewMode: 'years', 
     format: 'MM/DD/YYYY' 
    }); 
});