2016-08-09 71 views
0

您好我是編程學習新約daterange,發現這http://www.daterangepicker.com/如何從datepicker獲取價值?

我按照如何使用它,但我怎麼能得到這段代碼的日期數據到我的PHP? 我嘗試用得到,但它不工作

.PHP

<?php 
$startDate=$_GET['startDate']; 
$endDate=$_GET['endDate']; 
echo $statDate; 
?> 
<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> 

的.js

<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> 

謝謝

+5

奇怪,因爲它看起來我們不是爲地球上的每個第三方一段代碼的支持部門。 –

回答

0

你不能這樣做沒有窗體。基本上你需要做的是這樣的:

<!DOCTYPE html> 
<html dir="ltr" lang="en-US"> 
<head> 
    <meta charset="UTF-8" /> 
    <title>Daterangepicker Test</title> 
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet"> 
    <link rel="stylesheet" type="text/css" media="all" href="daterangepicker.css" /> 
    <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script> 
    <script type="text/javascript" src="moment.js"></script> 
    <script type="text/javascript" src="daterangepicker.js"></script> 

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries --> 
    <!--[if lt IE 9]> 
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> 
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> 
    <![endif]--> 
    <style type="text/css"> 
    body { 
     margin: 60px auto; 
     width: 480px; 
    } 
    #reportrange { 
     background: #fff; 
     cursor: pointer; 
     padding: 5px 10px; 
     border: 1px solid #ccc; 
     width: 100%; 
     margin-bottom: 15px; 
    } 
    </style> 
</head> 
<body> 

    <form method="get"> 
     <input type="hidden" id="start" name="startDate"> 
     <input type="hidden" id="end" name="endDate"> 

     <div id="reportrange" class="pull-right"> 
      <i class="glyphicon glyphicon-calendar fa fa-calendar"></i>&nbsp; 
      <span></span> <b class="caret"></b> 
     </div> 

     <input type="submit"> 

     <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); 

      $('#reportrange').on('apply.daterangepicker', function(ev, picker) { 
       $('input#start').val(picker.startDate.format('MM/DD/YYYY')); 
       $('input#end').val(picker.endDate.format('MM/DD/YYYY')); 
      }); 

      cb(start, end); 
     }); 
     </script> 
    </form> 
    <?php 
    if (isset($_GET['startDate']) && isset($_GET['endDate'])) { 
     $startDate = new DateTime($_GET['startDate']); 
     $endDate = new DateTime($_GET['endDate']); 
    ?> 
     <h2>Your chosen period is:</h2> 
    <?php 
     echo '<strong>' . $startDate->format('D, M j, Y') . '</strong> - <strong>' . $endDate->format('D, M j, Y') . '</strong>'; 
    } 
    ?> 
</body> 
</html> 
+0

完美謝謝:) – Skieth

0

當您使用日期範圍選擇器,你會得到一個日期範圍字符串。就像「2016-08-09 10:11:12-2017-05-06 12:34:12」,你可能會注意到它只是一個格式化的字符串,但是你的PHP代碼必須得到一個獨立的值。

這是我的解決方案。

<input type="text" id="drpicker"/> 
<input type="hidden" id="start" name="startDate"/> 
<input type="hidden" id="end" name="endDate" /> 

//after you initialized your picker 
picker.on('apply.daterangepicker', function (ev, picker) { 
    var start = picker.startDate.format(dateFormat); 
    var end = picker.endDate.format(dateFormat); 
    $("#start).val(start); 
    $("#end").val(end); 
}); 

的話,你應該聽的回調事件apply.daterangepicker,它是你做了之後,你selection.And你會得到你的startDate結束endDate.Then可以將其設置爲輸入[隱藏]元素調用。 您的服務器端PHP代碼將得到分隔日期值