2015-07-21 47 views
4

有很多日期/日期時間選擇器實現在那裏。是否有任何與Django和Crispy Forms很好地結合在一起,它們是如何被使用的?Django 1.8&Django Crispy Forms:是否有一個簡單,簡單的方法來實現Date Picker?

我正在尋找最小化開發工作,最大限度地簡化,並利用Django本地化。

一個Django /脆皮標準輸出日期字段:

<input class="dateinput form-control" id="id_birth_date" name="birth_date" type="text" value="21/07/2015"> 

在Model:

birth_date = models.DateField(verbose_name='D.O.B', auto_now_add=False, auto_now=False) 

謝謝!

編輯:

簡介型號:

from django.db import models 

class Profile(models.Model): 
    birth_date = models.DateField(verbose_name='D.O.B', auto_now_add=False, auto_now=False) 

檔案形式:

from django import forms 
from profiles.models import Profile 


class ProfileForm(forms.ModelForm): 
    class Meta: 
     model = Profile 
     birth_date = forms.DateField(
      widget=forms.TextInput(
       attrs={'type': 'date'} 
      ) 
     ) 

資料查看:

from django.shortcuts import get_object_or_404 
from django.contrib.auth import get_user_model 
from profiles.models import Profile 
from profiles.forms import ProfileForm 

User = get_user_model() 

def edit(request): 
    profile = get_object_or_404(Profile, user=request.user) 
    form = ProfileForm(request.POST or None, request.FILES or None, instance=profile) 
    if request.method == 'POST' and form.is_valid(): 
     form.save() 
    context = { 
     'form': form, 
     'page_title': 'Edit Profile', 
    } 
    return render(request, 'profiles/edit.html', context) 

檔案編輯模板:

<form enctype="multipart/form-data" method="POST" action="."> 
    {% csrf_token %} 
    {{ form }} 
    <input class='btn btn-primary' type="submit" value="Submit" /> 
</form> 

回答

6

不爲鬆脆的形式,但新的瀏覽器的答案將實施日期選擇爲你只要要點因爲輸入具有date的屬性type。這屬於最小發展努力的範疇。

date_field = forms.DateField(
    widget=forms.TextInput(  
     attrs={'type': 'date'} 
    ) 
)           
+0

謝謝奧斯汀。這會去哪裏?有沒有一種方法可以覆蓋項目中每個用途的date_field? – StringsOnFire

+0

您可以將它放在窗體Class中作爲其字段之一。就像'your_name'如何在這裏使用:https://docs.djangoproject.com/en/1.8/topics/forms/#building-a-form-in-django – Austin

+0

這可以在模型中完成嗎? – StringsOnFire

0

簡單的方法是覆蓋領域的模板:d

Field('field_name', template='date.html') 

Here從@maraujop

+0

謝謝madzohan,但這比我目前所尋找的要複雜一點。 – StringsOnFire

0

我的解決方案很簡單,並使用https://eonasdan.github.io/bootstrap-datetimepicker/的datetimepicker。

包括CSS文件:

<link href="{% static 'css/bootstrap-datetimepicker.min.css' %}" rel="stylesheet"> 

包含的js文件:

<script src="{% static 'js/jquery-3.1.1.js' %}"></script> 
<script src="{% static 'js/bootstrap.min.js' %}"></script> 
<script src="{% static 'js/moment-master/min/moment.min.js' %}"></script> 
<script src="{% static 'js/bootstrap-datetimepicker.min.js' %}"></script> 

定義的形式領域的CSS類(也有脆皮作品):

class MyForm(forms.ModelForm): 
    class Meta: 
     model = MyModelo 
     fields =  ['a','b','c'] 

    def __init__(self, *args, **kwargs): 
     super(MyForm, self).__init__(*args, **kwargs) 
     self.fields['a'].widget.attrs['class'] = 'datepicker' 

在模板中包含鏈接到css類的JQuery函數:

<script type="text/javascript"> 
$(function() { 
    $('.datepicker').datetimepicker(
    { 
     format: 'YYYY-MM-DD HH:mm:ss', 
     sideBySide: true 
    } 
    ); 
}); 
</script> 

此解決方案在Django 1.10,Crispy Forms和Django Model Forms中運行良好。

+0

向django添加bootstrap-datetimepicker的更簡單方法是使用[django-bootstrap-datepicker](https://github.com/pbucher/django-bootstrap-datepicker)。我試過了,它似乎工作正常。 –

相關問題