Skip to content

Instantly share code, notes, and snippets.

@dangrossman
Created April 28, 2018 19:56
Show Gist options
  • Save dangrossman/8c6747b82572bc860364f17258004dbb to your computer and use it in GitHub Desktop.
Save dangrossman/8c6747b82572bc860364f17258004dbb to your computer and use it in GitHub Desktop.
<div id="reportrange" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc; width: 100%">
<i class="fa fa-calendar"></i>&nbsp;
<span></span> <i class="fa fa-caret-down"></i>
</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>
@jhondoedo
Copy link

I have two input field with id "id_start_date" and "id_end_date" . how can i pass the values to this fields in this format "2019-04-24"?

<div id="div_id_start_date" class="form-group">
    <label for="id_start_date" class="col-form-label ">
        Start date
    </label>
    <div class="">
        <input type="text" name="start_date" value="2019-04-24" class="datetimeinput form-control" id="id_start_date"> </div>
</div>
<div id="div_id_end_date" class="form-group">
    <label for="id_end_date" class="col-form-label ">
        End date
    </label>
    <div class="">
        <input type="text" name="end_date" value="2019-05-02" class="datetimeinput form-control" id="id_end_date"> </div>
</div>

<input type="submit" id="btnsubmit" value="Submit">

@dangrossman
Copy link
Author

function cb(start, end) {
    $('#id_start_date').val(start.format('YYYY-MM-DD'));
    $('#id_end_date').val(end.format('YYYY-MM-DD'));
}

@Brian-beepboop
Copy link

is there a way to do an altFormat like the flatpickr?

altFormat | String | "F j, Y" | Exactly the same as date format, but for the altInput field
altInput | Boolean | false | Show the user a readable date (as per altFormat), but return something totally different to the server.

@dangrossman
Copy link
Author

No

@Markusovich
Copy link

How can I access the value of the reportrange div in flask?

@CickBala
Copy link

CickBala commented Oct 6, 2021

How to add place holder

@CickBala
Copy link

CickBala commented Oct 6, 2021

First show place holder all data showing in the table How

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment