I'm not able to retrieve date input from a Form, into my View

Using Django Templates & Frontend
1

Hey, I’m new here and I need help. This may be a very stupid question, and it’s likely my HTML or JavaScript is completely wrong in the Template, but for the life of me I cannot get my View’s request.POST.get(‘filterDateStart’) and request.POST.get(‘filterDateEnd’) to ever receive any value that isn’t None. The View is working fine for other filtering criteria, it’s just the date widget that I cannot get to work.

Basically the problem seems to be related to a JS script I’m using the make the date filtering optional, disabling the date picker widget when the ‘All Dates’ radio button is selected.

This is my template:

<script>
    function toggleDateInputs() {
        const customDatesSelected = document.getElementById('customDates').checked;
        const dateInputs = document.getElementById('dateRangeInputs');
        const dateStart = document.getElementById('filterDateStart');
        const dateEnd = document.getElementById('filterDateEnd');

        if (customDatesSelected) {
            dateStart.disabled = false;
            dateEnd.disabled = false;
            dateStart.required = true;
            dateEnd.required = true;
        } else {
            dateStart.disabled = true;
            dateEnd.disabled = true;
            dateStart.required = false;
            dateEnd.required = false;
        }
    }
</script>

<div class="container-fluid">
    <div class="row">
        <div class="col-2 light-grey card" style="border-radius: 0; background-color: rgb(232, 232, 232)">
            <!-- This is the light grey container -->
            <h4 class="mt-2">Custom Filters</h4>
            <p>Customize your data set here.</p>

            <form id="filterForm" method="POST" action="{% url 'analytics_results' %}">
                {% csrf_token %}
                
                <div class="mb-3">
                    <label for="result-filter" class="form-label">Filter by Bet Result</label>
                    <select class="form-select" name="result-filter" id="result-filter" required>
                        <option value="category-all">All Results</option>
                        <option value="Win">Win</option>
                        <option value="Lose">Lose</option>
                        <option value="Push">Push</option>
                        <option value="Pending">Pending</option>
                    </select>
                </div>
                <div class="mb-3">
                    <label for="tag-filter" class="form-label">Filter by Custom Tags</label>
                    <select class="form-select" id="tag-filter" required>
                        <option value="category-all">All Tags</option>
                        <option value="category1">tag 1</option>
                        <option value="category2">tag 2</option>
                        <option value="category3">tag 3</option>
                        <option value="category4">tag 4</option>
                    </select>
                </div>
                <div class="mb-3">
                    <label class="form-label">Select Date Option</label>
                    <p><i>(this will filter by the "Date added" attribute)</i></p>
                    <div>
                        <input type="radio" id="allDates" name="dateOption" value="all" checked onclick="toggleDateInputs()">
                        <label for="allDates">All Dates</label>
                    </div>
                    <div>
                        <input type="radio" id="customDates" name="dateOption" value="custom" onclick="toggleDateInputs()">
                        <label for="customDates">Custom Dates</label>
                    </div>
                </div>
                
                <div class="mb-3" id="dateRangeInputs">
                    <label for="filterDate" class="form-label">Date Range</label>
                    <input type="date" class="form-control" id="filterDateStart" name="filterDateStart" required disabled>
                    <input type="date" class="form-control mt-2" id="filterDateEnd" name="filterDateEnd" required disabled>
                </div>
                
                <div class="d-flex justify-content-center">
                    <button type="submit" class="btn btn-primary btn-lg m-2 border border-dark">FILTER</button>
                </div>
                

            </form>
2

Welcome @nicoferreira90 !

This template is working in my test environment - at least as far as submitting the dates in the form.

Please post the view that is attempting to process this data.

3

Thank you Ken for answering. Within the IF loop, filter_date_start and filter_date_end are always printed as having a value of None, no matter the Form data I submit.

class AnalyticsWithResultsView(LoginRequiredMixin, TemplateView):
    template_name = "analytics/analytics_with_results.html"
    login_url = "/users/login/"

    def post(self, request, *args, **kwargs):
        # Process form data here
        filter_result = request.POST.get('result-filter')  # Retrieve the result filter directly

        filter_date_option = request.POST.get('dateOption') # Retrieve the date filter directly

        if filter_date_option == 'custom': # Retrieve the custom date range from the form, only if the option 'custom' option is selected

            filter_date_start = request.POST.get('filterDateStart')
            print("date start", filter_date_start)

            filter_date_end = request.POST.get('filterDateEnd')
            print("date end", filter_date_end)
        else:
            filter_date_start = None
            filter_date_end = None

        user_bets = self.get_filtered_bet_list(filter_result=filter_result,
                                               filter_date_option=filter_date_option, 
                                               filter_date_start=filter_date_start, 
                                               filter_date_end = filter_date_end) 

        context = self.get_context_data(**kwargs)  # Get existing context

        context['user_bets'] = user_bets

        context['bet_count'] = user_bets.count()

        context['bets_pending_count'] = user_bets.filter(result="Pending").count()

        context['bets_won_count'] = user_bets.filter(result="Win").count()

        context['bets_lost_count'] = user_bets.filter(result="Lose").count()

        context['bets_pushed_count'] = user_bets.filter(result="Push").count()

        if (user_bets.filter(result="Win").count()+user_bets.filter(result="Lose").count()) > 0: # avoid dividing by 0
            context['bet_win_percentage'] = 100*user_bets.filter(result="Win").count()/(user_bets.filter(result="Win").count()+user_bets.filter(result="Lose").count())
        else:
            context['bet_win_percentage'] = 0

        context["average_odds"] = user_bets.aggregate(Avg("odds", default=0))["odds__avg"]

        total_amount_wagered = user_bets.aggregate(total=Sum("stake"))
        context["total_amount_wagered"] = total_amount_wagered['total']

        running_result_list = running_result(user_bets)
        context["net_result"] = running_result_list[-1]

        if total_amount_wagered['total'] != 0:
            roi = None
        else:
            roi = running_result_list[-1]/total_amount_wagered['total']
            context["roi"] = roi*100

        context['graph'] = self.get_user_result_graph(filter_result)  # Pass filter if needed

        return self.render_to_response(context)
    

    def get_filtered_bet_list(self, filter_result, filter_date_option=None, filter_date_start=None, filter_date_end=None):
        """Return only bets made by the user, and also that meet the filter criteria."""
        bet_set = Bet.objects.filter(bet_owner=self.request.user)

        print("Received filter result:", filter_result)  # Debugging line
        print("Received filter date_range:", filter_date_option)
        print("Received start date:", filter_date_start)
        print("Received end date:", filter_date_end)

        if filter_result != 'category-all':
            bet_set = bet_set.filter(result=filter_result)
            print("After filtering by result:", bet_set)
        
        if filter_date_option == 'custom':
            bet_set = bet_set.filter(date_added__range=[filter_date_start, filter_date_end])
            print("After filtering by date range:", bet_set)
        
        return bet_set
    

    def get_user_result_graph(self, filter_result):
        print("getting graph...")
        user_bets = self.get_filtered_bet_list(filter_result)  # Pass the filter_result
        running_result_list = running_result(user_bets)
        graph = graph_results(running_result_list)
        return graph
    

    def get_context_data(self, **kwargs): 
        context = super().get_context_data(**kwargs)  
        # No need to call get_filtered_bet_list here without the filter
        return context
4

Unfortunately, I cannot recreate your symptoms here. Your template combined with the portion of the view through the if filter_date_option == 'custom' block works perfectly on my system.

This implies there’s some other component here that is interfering with this process - either some middleware or some other code - possibly other JavaScript running on that page.

I think the next thing to check is to verify that all the data is getting posted correctly to the server. You can check your network tab in your browser’s developer tools to see what data is being submitted, and also add a print(request.POST) as the first line of your post method.

1 Like
5

Ok thank you very much. I think I got it to work now.