2017-02-27 118 views
1

我想知道爲什麼我無法獲取我的隱藏輸入值(日期選擇器引導內聯) 將內置日期選擇器內聯爲doc,所以我必須添加隱藏輸入並在此之後獲得他對變化的價值。獲取隱藏輸入的更改值

HTML代碼

<div id="datepicker" class="input-group date" data-date-format="dd-mm-yyyy"></div> 
<input type="hidden" id="my_hidden_input" class="form-control"> 

JS代碼:

jQuery('#datepicker').datepicker(); 
jQuery('#datepicker').on('changeDate', function() { 
jQuery('#my_hidden_input').val(
     jQuery('#datepicker').datepicker('getFormattedDate') 
    ); 
}); 

jQuery(document).ready(function() { 
    jQuery("#datepicker").datepicker({ 
     startDate: new Date(), 
     language: "fr", 
     autoOpen:true, 
     autoclose: true, 
     todayHighlight: true 
     //datesDisabled: ['22/02/2017', '28/02/2017'] 
    }).datepicker('update', new Date());; 
}); 



jQuery("#datepicker .form-control").val().trigger('change', function() { 
    alert(jQuery(this).val()); //here 
}); 

jQuery('#datepicker').datepicker(); 
 
     jQuery('#datepicker').on('changeDate', function() { 
 
      jQuery('#my_hidden_input').val(
 
       jQuery('#datepicker').datepicker('getFormattedDate') 
 
     ); 
 
     }); 
 
    
 
jQuery(document).ready(function() { 
 
     jQuery("#datepicker").datepicker({ 
 
      startDate: new Date(), 
 
      language: "fr", 
 
      autoOpen:true, 
 
      autoclose: true, 
 
      todayHighlight: true 
 
     }).datepicker('update', new Date());; 
 
    }); 
 
    
 
    
 
jQuery("#datepicker .form-control").change(function() { 
 
     alert(jQuery(this).val()); 
 
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet"/> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/css/bootstrap-datepicker3.css" rel="stylesheet"/> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/locales/bootstrap-datepicker.fr.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 
 
<div id="datepicker" class="input-group date" data-date-format="dd-mm-yyyy"></div> 
 
      <input type="hidden" id="my_hidden_input" class="form-control">

+0

創建。所以,一個小提琴鏈接我們可以檢查 –

回答

0

嘗試包括:

<script src="jquery-ui.js"></script> 

或嘗試檢查,如果你有一些雙進口(如的jquery.js和jquery.min.js)

0

你可以試試這個

jQuery(document).ready(function() { 
    var datepicker = jQuery("#datepicker").datepicker({ 
     startDate: new Date(), 
     language: "fr", 
     autoOpen:true, 
     autoclose: true, 
     todayHighlight: true 
     //datesDisabled: ['22/02/2017', '28/02/2017'] 
    }).datepicker('update', new Date()); 
    datepicker.on('changeDate', function() { 
     jQuery('#my_hidden_input').val(
      jQuery(this).datepicker('getFormattedDate') 
    ); 
    }); 
});