日期时间选择器:如何根据 SQL 数据库设置 min/max 日期

Date time Picker: how to set the min/max date based on SQL database

有两列:年份;一月 MySQL table。 现在我已经实现了在html中显示下拉日期table(Y/M)的功能。 (基于 dJango + jquery 日期时间选择器)。我在下面附上了这部分代码;

下一步是根据 SQL table 中的 earliest/latest 日期 (Y/M) 限制日期范围。然后我不知道如何根据 SQL 数据库设置此 mindate 和 maxdate。非常感谢任何指导。

HTML

<!DOCTYPE html>  
<html> 
<head>  
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>  
    <title>Input Table</title>  
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
    <link rel="stylesheet" type="text/css" media="screen" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/base/jquery-ui.css">

 <script type="text/javascript">
    $(function() {
 $('.date-picker').datepicker(
                {
                    dateFormat: "mm/yy",
                    changeMonth: true,
                    changeYear: true,
                    showButtonPanel: true,
                    mindate:  ***-------How to write the code here to get SQL date range?***


                    onClose: function(dateText, inst) {


                        function isDonePressed(){
                            return ($('#ui-datepicker-div').html().indexOf('ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all ui-state-hover') > -1);
                        }

                        if (isDonePressed()){
                            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
                            var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
                            $(this).datepicker('setDate', new Date(year, month, 1)).trigger('change');

                             $('.date-picker').focusout()//Added to remove focus from datepicker input box on selecting date
                        }
                    },
                    beforeShow : function(input, inst) {

                        inst.dpDiv.addClass('month_year_datepicker')

                        if ((datestr = $(this).val()).length > 0) {
                            year = datestr.substring(datestr.length-4, datestr.length);
                            month = datestr.substring(0, 2);
                            $(this).datepicker('option', 'defaultDate', new Date(year, month-1, 1));
                            $(this).datepicker('setDate', new Date(year, month-1, 1));
                            $(".ui-datepicker-calendar").hide();
                        }
                    }
                })
});
</script>

form.py

class inputform(forms.ModelForm):
    company=forms.CharField() 
    start_date=forms.DateField(widget=DateInput())

class Meta:
    model = input
    fields = ('company','start_date')
    widgets = {
        'start_date': forms.DateInput(attrs={'class':'datepicker'}),
    }

views.py

@csrf_exempt
def input(request):
    if request.method == 'POST': 
        form = inputform(request.POST) 
        if form.is_valid(): 

            start_date=form.cleaned_data('start_date')
            return HttpResponseRedirect('templates/About') 

else:
    form = inputform() 

return render_to_response('inputform.html',{'form': form})

model.py

from datetime import date
from django.forms import widgets

class input(models.Model):
    company=models.CharField(max_length=100)
    start_date=models.DateField(auto_now=False, auto_now_add=False)

您可以做的是通过数据属性将 min/max 日期范围添加到您的 start_date 字段,如下所示

widgets = {
    'start_date': forms.DateInput(attrs={
        'class':'datepicker', 'data-min': YOUR_MIN_DATE, 
        'data-max': YOUR_MAX_DATE}),
}

然后在你的日期选择器初始化脚本中使用这个属性,就像这样

minDate: $(this).data('min'),
maxDate: $(this).data('max'),