'Chart with date selector in a Django project

I want to create a Javascript chart with a date selector in my Django project like this example: https://plotlydash.com/pie-chart-with-drop-down-list-and-date-picker-range-in-plotly-dash/

I created a date selector input in my chart.html file. This will allow me to append the input date value to URL when I click "generate report". For example: it will append: ?start=2022-02-02&end=2022-02-24 in the URL link.

<div class="d-sm-flex align-items-center justify-content-between mb-4">
  <form method="get" action="chart/">
    <div class="form-row">
     <label for="start">Start Date:</label>
     <div class="col">
        <input type="date" class="form-control" name="start_date" min="2020-01-03" required>
  </div>
  <label for="end">End Date:</label>
  <div class="col">
      <input type="date" class="form-control" name="start_date"  min="2020-01-03" required>
  </div>
  <button type="submit" class="btn btn-primary"><i class="fas fa-download fa-sm text-white-50"></i> Generate Report</button>
</div>
</form>

The output of this date selector on my chart.HTML page is: date

My chart data is based on a list of dictionaries. It's a Django project, so my data is defined in views.py: I count the number of records with Mike, Jane and Jack.

mylist=
[{'Date': '2021-10-02', 'ID': 11773, 'Receiver': Mike},
{'Date': '2021-10-02', 'ID': 15673, 'Receiver': Jane},
{'Date': '2021-10-03', 'ID': 11773, 'Receiver': Mike},
... 
{'Date': '2021-12-25', 'ID': 34653, 'Receiver': Jack}]

mike=len(tuple(d for d in mylist  if d['Receiver'] == 'Mike'))
jane=len(tuple(d for d in mylist  if d['Receiver'] == 'Jane'))
jack=len(tuple(d for d in mylist  if d['Receiver'] == 'Jack'))
count = [mike, jane, jack]

And the {{count}} is the data I put into the data area of my Javascript pie chart.

I wanted to add the following codes to define a new list that will change based on my input start & end date:

dfmylist = pd.DataFrame(mylist)
dfmylistnew = (dfmylist['Date'] > start_date) & (dft2022['Date'] <= end_date)
...
newcount = [newmike, newjane, newjack]

As I expected, it shows the error that start_date is not defined. What else should I do to add in my views.py to link my input date with my data?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source