2015-10-12 34 views
0

有兩列:年份;一個MySQL表中的月份。 現在我已經實現了在html中顯示下拉日期表(Y/M)的功能。 (基於dJango + jquery日期時間選擇器)。我附上了下面這段代碼;日期時間選擇器:如何根據SQL數據庫設置最小/最大日期

下一步是根據SQL表中最早/最近的日期(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) 

回答

2

你可以做的是通過數據屬性添加最小/最大日期範圍,以你的起始日期字段這樣

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

,然後使用這個屬性在你的日期選擇器的init腳本這樣的事情

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

嗨@尼克,這是我懷疑如何把'日期分鐘'和'日期最大',因爲結果是從SQL數據庫,而不是預定義的日期。 –

相關問題