使用javascript从bootstrap-datepicker获取输入值

Question

在我的Ruby-on-Rails项目中，我想从bootstrap datepicker添加一个字符串到隐藏字段。我需要引用输入类，但我不知道如何。

这是我的形式：

<%= simple_form_for([@event, @dateevent]) do |f| %> 
    <%= hidden_field_tag(:date, @datelist) %> 
    <%= f.input :date, :as => :hidden, :input_html => { :value => "placeholder" } %> 
    <%= f.button :submit %> 
<% end %> 

这是我实现引导日期选择的：

<input type="text" class='datepicker' > 

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $('.datepicker').datepicker({ 
     multidate: true, 
     format: 'dd-mm-yyyy' 
    }); 
    }); 
</script> 

我创建了一个按钮，即增加了选择的日期，以隐藏字段：

<button class="btn3">Add dates to the hidden field</button> 

    <script> 
    $(document).ready(function(){ 
     $(document).on('click', ".btn3", function() { 
     var datelist = $(".listb").text(); 
     document.getElementById('date').value = datelist; 
     }); 
    }); 
</script> 

检查，如果按钮真的有效，我这样做：

<div class="listb">2016-2-2</div> 

而当我按下按钮时，2016-2-2被添加到隐藏字段中，它正在工作。

然后我在Firefox打开萤火虫和点击的领域，其中引导日期选择器会将选择的日期，它看起来像这样：

<input class="datepicker" type="text"></input> 

在按键的我的JavaScript代码，我试过的这些行码，但既不工作：

var datelist = $(".datepicker").text(); 
var datelist = $(".datepicker").val(); 

什么我需要输入，所以从引导日期选择器领域的字符串添加到datelist？有任何想法吗？提前致谢！

这是整页：

<h2>Neuer Event</h2><br> 
<input type="text" class='datepicker' > 

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $('.datepicker').datepicker({ 
     multidate: true, 
     format: 'dd-mm-yyyy' 
    }); 
    }); 
</script> 
<br> 
<div class="listb">2016-2-2</div> 
<button class="btn3">Add dates to the hidden field</button> 

<%= simple_form_for([@event, @dateevent]) do |f| %> 
    <%= hidden_field_tag(:date, @datelist) %> 
    <%= f.input :date, :as => :hidden, :input_html => { :value => "placeholder" } %> 
    <%= f.button :submit %> 
<% end %> 

    <script> 

    $(document).ready(function(){ 
     $(document).on('click', ".btn3", function() { 
     var datelist = $(".listb").text(); 
     document.getElementById('date').value = datelist; 
     }); 
    }); 
</script> 

Answer 1

可以使用

//这个version

var datepicker = $('.datepicker').datepicker() 
    .on('changeDate', function(e) { 

     $('#date').val($(e.currentTarget).val());//1 
     $('#date').val(datepicker.getDate());//2 

    }); 

//或bootstrap 3

var datepicker = $('.datepicker').datepicker() 
    .on('dp.change', function(e) { 

     e = { 
    date, //date the picker changed to. Type: moment object (clone) 
    oldDate //previous date. Type: moment object (clone) or false in the event of a null 

} 


    }); 

Answer 2

国米。有趣，这个工程：

var datelist = $("input.datepicker").val();