2016-11-21 128 views

回答

0

我已經成功地使用了模板後付出了一些努力去理解它。

我創建了一個_layout視圖分離從模板的index.html導航佈局和腳本文件夾複製所有引用的JS/CSS文件和改變佈局有參考路徑爲好。

這很容易。

但是我發現一些jQuery的功能並不像.datepicker,型號和.valid或.validation模板工作。這些insted的使用歐芹的驗證方法,daterangepicker js和引導的模式彈出的模板。

並不總是易於使用的模板,但如果你瞭解它,最好將減少項目開發的UI努力。

0
<div id="reportrange" class="pull-right" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc; width: 100%"> 
    <i class="glyphicon glyphicon-calendar fa fa-calendar"></i>&nbsp; 
    <span></span> <b class="caret"></b> 
</div> 

<script type="text/javascript"> 
$(function() { 

    var start = moment().subtract(29, 'days'); 
    var end = moment(); 

    function cb(start, end) { 
     $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY')); 
    } 

    $('#reportrange').daterangepicker({ 
     startDate: start, 
     endDate: end, 
     ranges: { 
      'Today': [moment(), moment()], 
      'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')], 
      'Last 7 Days': [moment().subtract(6, 'days'), moment()], 
      'Last 30 Days': [moment().subtract(29, 'days'), moment()], 
      'This Month': [moment().startOf('month'), moment().endOf('month')], 
      'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')] 
     } 
    }, cb); 

    cb(start, end); 

}); 
</script>