2017-10-30 19 views
0

問題が1つあります...Bootstrap Datepickerで入力ボックス付きカレンダーを表示するには

入力欄のあるカレンダーが必要です。

任意の日付をクリックすると、その入力ボックスに表示されます。

このカレンダーは複数の日付を選択します。

すべての日付が入力ボックスに表示する必要があります。..

私は

Thats what I'm getting

を取得しています何これは私が

欲しいものです厥私は2枚の画像

を装着しています

This is what I want

私のコードは

HTML

$('.datepicker').datepicker({ 
 
\t multidate:true, 
 
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/css/bootstrap-datepicker.css" rel="stylesheet"/> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<!-- jQuery library --> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 

 
<!-- Latest compiled JavaScript --> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/js/bootstrap-datepicker.js"></script> 
 

 
<div class="col-md-4 div-margin"> 
 
\t <div class="datepicker"></div> 
 
</div>

+0

用入力I divの幹部 –

+0

カレンダーも表示したい..... – GYaN

答えて

1

を次のようにこのコードを試している:私は、このコードは役に立ち考える

<html> 
 
<head> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/css/bootstrap-datepicker.css" rel="stylesheet"/> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<!-- jQuery library --> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 

 
<!-- Latest compiled JavaScript --> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/js/bootstrap-datepicker.js"></script> 
 
<script> 
 

 
$(document).ready(function(){ 
 
$(".DateField").datepicker({ 
 
multidate:true, 
 
}); 
 
     
 
$(".table-condensed tbody").click(function(){ 
 
setTimeout(function(){ $('.abc').val($('.DateField[type=hidden]').val()); }, 1000) 
 

 

 
}); 
 

 
     
 
}); 
 

 
</script> 
 

 
</head> 
 
<body> 
 

 
<div class="col-md-4 div-margin"> 
 
\t <div class="DateField" value='' type='text'><input type='hidden' class='DateField' value=''></div> 
 
\t 
 
\t <input type='text' class='abc' value='' /> 
 
</div> 
 
</body> 
 
</html> \t

+1

いいえ............. – GYaN

関連する問題