Python 将django筛选器DateTimeFromToRangeFilter和DateTimeInput（日期选择器）组合使用_Python_Jquery_Django_Datepicker_Django Filter

Python 将django筛选器DateTimeFromToRangeFilter和DateTimeInput（日期选择器）组合使用

python jquery django

Python 将django筛选器DateTimeFromToRangeFilter和DateTimeInput（日期选择器）组合使用,python,jquery,django,datepicker,django-filter,Python,Jquery,Django,Datepicker,Django Filter,使用and作为日期选择器，我尝试添加日期和时间输入、FROM和to字段我只能从django表单或django过滤器使用dateinput，其中只有一个字段，而没有显示日期选择器（只是手动文本输入）这是我的过滤器\u model.py，用于带有日期选择器的一个字段 from app.models.api_status import ApiStatus import django_filters from django import forms class DateTimeInput(form

使用and作为日期选择器，我尝试添加日期和时间输入、FROM和to字段

我只能从django表单或django过滤器使用dateinput，其中只有一个字段，而没有显示日期选择器（只是手动文本输入）

这是我的过滤器\u model.py，用于带有日期选择器的一个字段

from app.models.api_status import ApiStatus
import django_filters
from django import forms

class DateTimeInput(forms.DateTimeInput):
    input_type = 'date'

    # working solution for just 1 date field
class ApiStatusFilter(django_filters.FilterSet):
    date_time = django_filters.DateFilter(
        label=('With start date'),
        lookup_expr=('icontains'), # use contains,
        widget=DateTimeInput()
    )
    class Meta:
        model = ApiStatus
        fields = ['id', 'date_time']

from app.models.api_status import ApiStatus
import django_filters
from django import forms

class DateTimeInput(forms.DateTimeInput):
    input_type = 'date'


class ApiStatusFilter(django_filters.FilterSet):
    date_time =django_filters.DateTimeFromToRangeFilter()

    class Meta:
        model = ApiStatus
        fields = ['id', 'date_time']
        widgets = {
            'date_time': forms.DateTimeInput(attrs={'placeholder':'Select a date'})
        }

图为可点击的日期选择器弹出窗口

这是我的过滤器\u model.py用于两个字段，从和到，不带日期选择器

from app.models.api_status import ApiStatus
import django_filters
from django import forms

class DateTimeInput(forms.DateTimeInput):
    input_type = 'date'

    # working solution for just 1 date field
class ApiStatusFilter(django_filters.FilterSet):
    date_time = django_filters.DateFilter(
        label=('With start date'),
        lookup_expr=('icontains'), # use contains,
        widget=DateTimeInput()
    )
    class Meta:
        model = ApiStatus
        fields = ['id', 'date_time']

from app.models.api_status import ApiStatus
import django_filters
from django import forms

class DateTimeInput(forms.DateTimeInput):
    input_type = 'date'


class ApiStatusFilter(django_filters.FilterSet):
    date_time =django_filters.DateTimeFromToRangeFilter()

    class Meta:
        model = ApiStatus
        fields = ['id', 'date_time']
        widgets = {
            'date_time': forms.DateTimeInput(attrs={'placeholder':'Select a date'})
        }

下图显示了没有日期选择器弹出窗口的手动文本输入。

这是我的模板文件，尽管我在尝试上述两种方法时没有对其进行太多修改。 status\u template.html

{% load static %}

<!DOCTYPE html>
<html lang="en">
    <head>
        <link rel="stylesheet" type="text/css" href="{% static 'css/table_styling.css' %}">
        <meta charset="UTF-8">
        <title>Test Site</title>
        {% comment %}
        <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
        <link rel="stylesheet" href="/resources/demos/style.css"> 
        <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
        <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
        {% endcomment %}
    </head>

    <body>
        <table>
            <thead>
                <tr>
                    {% for keys in dictionarys.keys %} 
                        <th>{{ keys }}</th>
                    {% endfor %}
                </tr>
            </thead>
            <tbody>
                <form method="get">
                    {{ apistatus_filter.form.as_p }}
                    <button type="submit">Search</button>
                        {% for user in dataqs.object_list %}
                        <tr>
                            <td>{{ user.id }}</td>
                            <td>{{ user.date_time }}</td>
                        {% endfor %}
                </form>
            </tbody>
        </table>
        {% comment %} <script>
            $( function() {
            $("#datepicker").datepicker();
            } );
        </script> {% endcomment %}
    </body>
</html>

{% load my_templatetags %}

<!DOCTYPE html>
<html lang="en">
    <head>
        <link rel="stylesheet" type="text/css" href="{% static 'css/search_form_table_styling.css' %}">
        <meta charset="UTF-8">
        <title>TEST Site</title>
    </head>

    <body>
        <form method="get" action="">
            <div class="search_form_wrapper">
                <div class="id_box">ID:{{ apistatus_filter.form.id }}</div>
                <div class="id_box">Date_Time:{{ apistatus_filter.form.date_time }}</div>
            </div>

            <input type="submit" value="Submit" class="search_form_submit">
        </form>

        <table>
            <tbody>
                {% for user in dataqs.object_list %}
                    <tr>
                        <td>{{ user.id }}</td>
                        <td>{{ user.date_time }}</td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>

        <div class="pagination">
            <span>
                {% if dataqs.has_previous %}
                    <a href="?{% query_transform request page=1 %}">&laquo; first</a>
                    <a href="?{% query_transform request page=dataqs.previous_page_number %}">previous</a>
                {% endif %}

                <span class="current">
                    Page {{ dataqs.number }} of {{ dataqs.paginator.num_pages }}.
                </span>

                {% if dataqs.has_next %}
                    <a href="?{% query_transform request page=dataqs.next_page_number %}">next</a>
                    <a href="?{% query_transform request page=dataqs.paginator.num_pages %}">last &raquo;</a>
                {% endif %}
            </span>
        </div> 
    </body>
</html>

{%load static%}
试验场地
{%comment%}
{%endcomment%}
{%用于字典中的键。键%}
{{keys}}
{%endfor%}
{{apistatus_filter.form.as_p}
搜寻
{dataqs.object_list%中的用户的%s}
{{user.id}
{{user.date\u time}
{%endfor%}
{%comment%}
$（函数（）{
$（“#日期选择器”）.datepicker（）；
} );
{%endcomment%}

我确实调查了这里和其他地方的各种来源。我试着使用MultiWidget和jQuery，但还没有让它们起作用。思想？提前谢谢

我没有使用外部依赖项（没有jquery）就可以解决这个问题，只使用了datetime本地输入和DateTimeFromToRangeFilter以及Range小部件。也许不是最理想的解决方案，但这是实现这一点的一种方法

我的模型、过滤器、视图和模板代码如下

model.py

from app.modules.string_handler import StringHandler
from django.db.models.signals import post_save
import datetime

class ApiStatus(models.Model):
    id = models.AutoField(primary_key=True)
    date_time = models.DateTimeField("Date_Time", default=datetime.datetime.now(), blank=True)

    class Meta:
        managed = True
        db_table = 'api_status'
        verbose_name = 'API STATUS'

    def __str__(self):
        "A string representation of the model."
        return f'{self.id},{self.token},{self.date_time},{self.status},{self.summary},{self.log}'

    def __unicode__(self):
        return self.created_at

from app.models.api_status import ApiStatus
import django_filters
from django import forms

class ApiStatusFilter(django_filters.FilterSet):

    date_time = django_filters.DateTimeFromToRangeFilter(
        lookup_expr=('icontains'),
        widget=django_filters.widgets.RangeWidget(
            attrs={'type':'datetime-local'}
        )
    )

    class Meta:
        model = ApiStatus
        fields = ['id', 'date_time']

from django.shortcuts import render
from app.models.filters_model import ApiStatusFilter
from app.models.api_status import ApiStatus
import requests
from django import forms

from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
import urllib
from datetime import datetime, timedelta

def status(request):
    apistatus_list = ApiStatus.objects.all()

    request.GET2 = request.GET.copy()

    if request.GET2.get('date_time_min'):
        request.GET2['date_time_min'] = datetime.strptime(request.GET2['date_time_min'],"%Y-%m-%dT%H:%M").strftime("%Y-%m-%d %H:%M")
    if request.GET2.get('date_time_max'):
        request.GET2['date_time_max'] = datetime.strptime(request.GET2['date_time_max'],"%Y-%m-%dT%H:%M").strftime("%Y-%m-%d %H:%M")

    apistatus_filter = ApiStatusFilter(request.GET2, queryset=apistatus_list)

    paginator = Paginator(apistatus_filter.qs, 10)
    page = request.GET.get('page')

    try:
        dataqs = paginator.page(page)
    except PageNotAnInteger:
        dataqs = paginator.page(1)
    except EmptyPage:
        dataqs = paginator.page(paginator.num_pages)

    return render(request, 'status_page_template.html', {'table_col_DATA':all_entries_ordered, 'dictionarys': dictionarys, 'apistatus_filter': apistatus_filter, 'dataqs': dataqs, 'allobjects': apistatus_list})

filter.py

from app.modules.string_handler import StringHandler
from django.db.models.signals import post_save
import datetime

class ApiStatus(models.Model):
    id = models.AutoField(primary_key=True)
    date_time = models.DateTimeField("Date_Time", default=datetime.datetime.now(), blank=True)

    class Meta:
        managed = True
        db_table = 'api_status'
        verbose_name = 'API STATUS'

    def __str__(self):
        "A string representation of the model."
        return f'{self.id},{self.token},{self.date_time},{self.status},{self.summary},{self.log}'

    def __unicode__(self):
        return self.created_at

from app.models.api_status import ApiStatus
import django_filters
from django import forms

class ApiStatusFilter(django_filters.FilterSet):

    date_time = django_filters.DateTimeFromToRangeFilter(
        lookup_expr=('icontains'),
        widget=django_filters.widgets.RangeWidget(
            attrs={'type':'datetime-local'}
        )
    )

    class Meta:
        model = ApiStatus
        fields = ['id', 'date_time']

from django.shortcuts import render
from app.models.filters_model import ApiStatusFilter
from app.models.api_status import ApiStatus
import requests
from django import forms

from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
import urllib
from datetime import datetime, timedelta

def status(request):
    apistatus_list = ApiStatus.objects.all()

    request.GET2 = request.GET.copy()

    if request.GET2.get('date_time_min'):
        request.GET2['date_time_min'] = datetime.strptime(request.GET2['date_time_min'],"%Y-%m-%dT%H:%M").strftime("%Y-%m-%d %H:%M")
    if request.GET2.get('date_time_max'):
        request.GET2['date_time_max'] = datetime.strptime(request.GET2['date_time_max'],"%Y-%m-%dT%H:%M").strftime("%Y-%m-%d %H:%M")

    apistatus_filter = ApiStatusFilter(request.GET2, queryset=apistatus_list)

    paginator = Paginator(apistatus_filter.qs, 10)
    page = request.GET.get('page')

    try:
        dataqs = paginator.page(page)
    except PageNotAnInteger:
        dataqs = paginator.page(1)
    except EmptyPage:
        dataqs = paginator.page(paginator.num_pages)

    return render(request, 'status_page_template.html', {'table_col_DATA':all_entries_ordered, 'dictionarys': dictionarys, 'apistatus_filter': apistatus_filter, 'dataqs': dataqs, 'allobjects': apistatus_list})

view.py

from app.modules.string_handler import StringHandler
from django.db.models.signals import post_save
import datetime

class ApiStatus(models.Model):
    id = models.AutoField(primary_key=True)
    date_time = models.DateTimeField("Date_Time", default=datetime.datetime.now(), blank=True)

    class Meta:
        managed = True
        db_table = 'api_status'
        verbose_name = 'API STATUS'

    def __str__(self):
        "A string representation of the model."
        return f'{self.id},{self.token},{self.date_time},{self.status},{self.summary},{self.log}'

    def __unicode__(self):
        return self.created_at

from app.models.api_status import ApiStatus
import django_filters
from django import forms

class ApiStatusFilter(django_filters.FilterSet):

    date_time = django_filters.DateTimeFromToRangeFilter(
        lookup_expr=('icontains'),
        widget=django_filters.widgets.RangeWidget(
            attrs={'type':'datetime-local'}
        )
    )

    class Meta:
        model = ApiStatus
        fields = ['id', 'date_time']

from django.shortcuts import render
from app.models.filters_model import ApiStatusFilter
from app.models.api_status import ApiStatus
import requests
from django import forms

from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
import urllib
from datetime import datetime, timedelta

def status(request):
    apistatus_list = ApiStatus.objects.all()

    request.GET2 = request.GET.copy()

    if request.GET2.get('date_time_min'):
        request.GET2['date_time_min'] = datetime.strptime(request.GET2['date_time_min'],"%Y-%m-%dT%H:%M").strftime("%Y-%m-%d %H:%M")
    if request.GET2.get('date_time_max'):
        request.GET2['date_time_max'] = datetime.strptime(request.GET2['date_time_max'],"%Y-%m-%dT%H:%M").strftime("%Y-%m-%d %H:%M")

    apistatus_filter = ApiStatusFilter(request.GET2, queryset=apistatus_list)

    paginator = Paginator(apistatus_filter.qs, 10)
    page = request.GET.get('page')

    try:
        dataqs = paginator.page(page)
    except PageNotAnInteger:
        dataqs = paginator.page(1)
    except EmptyPage:
        dataqs = paginator.page(paginator.num_pages)

    return render(request, 'status_page_template.html', {'table_col_DATA':all_entries_ordered, 'dictionarys': dictionarys, 'apistatus_filter': apistatus_filter, 'dataqs': dataqs, 'allobjects': apistatus_list})

template.html

{% load static %}

<!DOCTYPE html>
<html lang="en">
    <head>
        <link rel="stylesheet" type="text/css" href="{% static 'css/table_styling.css' %}">
        <meta charset="UTF-8">
        <title>Test Site</title>
        {% comment %}
        <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
        <link rel="stylesheet" href="/resources/demos/style.css"> 
        <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
        <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
        {% endcomment %}
    </head>

    <body>
        <table>
            <thead>
                <tr>
                    {% for keys in dictionarys.keys %} 
                        <th>{{ keys }}</th>
                    {% endfor %}
                </tr>
            </thead>
            <tbody>
                <form method="get">
                    {{ apistatus_filter.form.as_p }}
                    <button type="submit">Search</button>
                        {% for user in dataqs.object_list %}
                        <tr>
                            <td>{{ user.id }}</td>
                            <td>{{ user.date_time }}</td>
                        {% endfor %}
                </form>
            </tbody>
        </table>
        {% comment %} <script>
            $( function() {
            $("#datepicker").datepicker();
            } );
        </script> {% endcomment %}
    </body>
</html>

{% load my_templatetags %}

<!DOCTYPE html>
<html lang="en">
    <head>
        <link rel="stylesheet" type="text/css" href="{% static 'css/search_form_table_styling.css' %}">
        <meta charset="UTF-8">
        <title>TEST Site</title>
    </head>

    <body>
        <form method="get" action="">
            <div class="search_form_wrapper">
                <div class="id_box">ID:{{ apistatus_filter.form.id }}</div>
                <div class="id_box">Date_Time:{{ apistatus_filter.form.date_time }}</div>
            </div>

            <input type="submit" value="Submit" class="search_form_submit">
        </form>

        <table>
            <tbody>
                {% for user in dataqs.object_list %}
                    <tr>
                        <td>{{ user.id }}</td>
                        <td>{{ user.date_time }}</td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>

        <div class="pagination">
            <span>
                {% if dataqs.has_previous %}
                    <a href="?{% query_transform request page=1 %}">&laquo; first</a>
                    <a href="?{% query_transform request page=dataqs.previous_page_number %}">previous</a>
                {% endif %}

                <span class="current">
                    Page {{ dataqs.number }} of {{ dataqs.paginator.num_pages }}.
                </span>

                {% if dataqs.has_next %}
                    <a href="?{% query_transform request page=dataqs.next_page_number %}">next</a>
                    <a href="?{% query_transform request page=dataqs.paginator.num_pages %}">last &raquo;</a>
                {% endif %}
            </span>
        </div> 
    </body>
</html>

{%load my_templatetags%}
试验场地
ID:{{apistatus_filter.form.ID}
日期\时间：{{apistatus\ U filter.form.Date\ U Time}
{dataqs.object_list%中的用户的%s}
{{user.id}
{{user.date\u time}
{%endfor%}
{%如果dataqs.has_previous%}
{%endif%}
{{dataqs.paginator.num_pages}中的{{dataqs.number}页。
{%如果dataqs.has_next%}
{%endif%}

可以使用javascript使范围字段具有

日期选择器

类

我正努力让jQuery datepicker与Django过滤器中的

DateTimeFromToRangeFilter

配合使用

RangeWidget

。出于某种原因，

RangeWidget

似乎不接受

class:datepicker

Filters.py：

dtoriginal = django_filters.DateTimeFromToRangeFilter(lookup_expr='icontains',
    widget=django_filters.widgets.RangeWidget(
        attrs={
            'placeholder': 'yyyy-mm-dd',
        },
    ),
    label = 'Date Original'
)

我更改了搜索模板html以包含以下脚本：

<form method="get">
  {{ filter.form.as_p }}

  <script>
    $(function () {
      $("id_dtoriginal_0").datepicker();
      $("id_dtoriginal_1").datepicker();
    });
  </script>

  {% if filter.is_bound %}
    <button onclick=...></button
  {% endif %}
</form>


{{filter.form.as_p}
$（函数（）{
$（“id\u dtoriginal\u 0”）.datepicker（）；
$（“id\u dtoriginal\u 1”）.datepicker（）；
});
{%if filter.is_-bound%}