What wrong in my code? I can't find my false.. in this jquery I have a value range, but if I send value to controller start and end date is null ??
this error Uncaught TypeError: $(...).daterangepicker is not a function
<script type="text/javascript" src="//cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script> {{-- compiled js --}} <!--<script src="{{ asset('js/jquery-1.12.4.js') }}"></script>!--> <script src="{{ asset('js/jquery.dataTables.min.js') }}"></script> <script src="{{ asset('js/jQuery-dataTables-Material.js') }}"></script> <!-- Include Date Range Picker --> <script type="text/javascript" src="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.js"></script> <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.css" />
this is my code jQuery in view blade
<script type="text/javascript"> $(function() { var start = moment('<?php echo $start; ?>','DDMMYYYY'); var end = moment('<?php echo $end; ?>','DDMMYYYY'); function cb(start, end) { alert(start); $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY')); $('body').append($('<form/>') .attr({'action': './invoiceList', 'method': 'post', 'id': 'replacer'}) .append($('<input/>') .attr({'type': 'hidden', 'name': 'start', 'value': start.format('DDMMYYYY')}) ) .append($('<input/>') .attr({'type': 'hidden', 'name': 'end', 'value': end.format('DDMMYYYY')}) ) ).find('#replacer').submit(); } $('#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); }); $('#reportrange').on('apply.daterangepicker', function (ev, picker) { console.log('start: '+picker.startDate.format('YYYY-MM-DD')); console.log('end : '+picker.endDate.format('YYYY-MM-DD')); days = (moment(picker.endDate)-moment(picker.startDate))/ 1000/60/60/24; console.log('Range : '+Math.round(days)+' days' ); }); $(document).ready(function() { $('#invoice').DataTable(); } ); </script>
this is my code to range date.