Add custom form field settings for datetime/date fields.

This commit is contained in:
Christopher Charbonneau Wells 2017-09-17 14:54:50 -04:00
parent 33239a097b
commit dad1ff73ca
6 changed files with 31 additions and 14 deletions

View File

@ -6,27 +6,44 @@
{% for field in form %} {% for field in form %}
<div class="d-none">{{ field|field_type }}</div> <div class="d-none">{{ field|field_type }}</div>
<div class="form-group row"> <div class="form-group row">
{% if field|field_type == 'booleanfield' %} {% if field|field_type == "booleanfield" %}
<div class="col-sm-1">&nbsp;</div> <div class="col-sm-1 d-none d-sm-block">&nbsp;</div>
<div class="col-sm-11"> <div class="col-sm-11">
<div class="form-check"> <div class="form-check">
<label for="id_{{ field.name }}" class="form-check-label"> <label for="id_{{ field.name }}" class="form-check-label">
{% if field.errors %} {% if field.errors %}
{{ field|add_class:'form-check-input is-invalid' }} {{ field|add_class:"form-check-input is-invalid" }}
{% else %} {% else %}
{{ field|add_class:'form-check-input' }} {{ field|add_class:"form-check-input" }}
{% endif %} {% endif %}
{{ field.label }} {{ field.label }}
</label> </label>
</div> </div>
</div> </div>
{% elif field|field_type == "datetimefield" or field|field_type == "datefield" %}
<label for="id_{{ field.name }}" class="col-sm-1 col-form-label">{{ field.label }}</label>
<div class="col-sm-11">
<div class="form-group">
<div class="input-group date" id="datetimepicker_{{ field.name }}" data-target-input="nearest">
<div class="input-group-addon" data-target="#datetimepicker_{{ field.name }}" data-toggle="datetimepicker">
<i class="fa fa-calendar"></i>
</div>
<input name="{{ field.html_name }}"
required="{{ field.required }}"
class="form-control datetimepicker-input{% if field.errors %} is-invalid{% endif %}"
data-target="#datetimepicker_{{ field.name }}"
id="id_{{ field.name }}"
type="text"/>
</div>
</div>
</div>
{% else %} {% else %}
<label for="id_{{ field.name }}" class="col-sm-1 col-form-label">{{ field.label }}</label> <label for="id_{{ field.name }}" class="col-sm-1 col-form-label">{{ field.label }}</label>
<div class="col-sm-11"> <div class="col-sm-11">
{% if field.errors %} {% if field.errors %}
{{ field|add_class:'form-control is-invalid' }} {{ field|add_class:"form-control is-invalid" }}
{% else %} {% else %}
{{ field|add_class:'form-control' }} {{ field|add_class:"form-control" }}
{% endif %} {% endif %}
</div> </div>
{% endif %} {% endif %}

View File

@ -20,7 +20,7 @@
{% block javascript %} {% block javascript %}
<script type="text/javascript"> <script type="text/javascript">
$(function () { $(function () {
$('#id_birth_date').datetimepicker({ $('#datetimepicker_birth_date').datetimepicker({
viewMode: 'years', viewMode: 'years',
format: 'YYYY-MM-DD' format: 'YYYY-MM-DD'
}); });

View File

@ -20,7 +20,7 @@
{% block javascript %} {% block javascript %}
<script type="text/javascript"> <script type="text/javascript">
$(function () { $(function () {
$('#id_time').datetimepicker({ $('#datetimepicker_time').datetimepicker({
defaultDate: 'now', defaultDate: 'now',
format: 'YYYY-MM-DD HH:mm' format: 'YYYY-MM-DD HH:mm'
}); });

View File

@ -20,11 +20,11 @@
{% block javascript %} {% block javascript %}
<script type="text/javascript"> <script type="text/javascript">
$(function () { $(function () {
$('#id_start').datetimepicker({ $('#datetimepicker_start').datetimepicker({
format: 'YYYY-MM-DD HH:mm', format: 'YYYY-MM-DD HH:mm',
useCurrent: false useCurrent: false
}); });
$('#id_end').datetimepicker({ $('#datetimepicker_end').datetimepicker({
defaultDate: 'now', defaultDate: 'now',
format: 'YYYY-MM-DD HH:mm' format: 'YYYY-MM-DD HH:mm'
}); });

View File

@ -20,11 +20,11 @@
{% block javascript %} {% block javascript %}
<script type="text/javascript"> <script type="text/javascript">
$(function () { $(function () {
$('#id_start').datetimepicker({ $('#datetimepicker_start').datetimepicker({
format: 'YYYY-MM-DD HH:mm', format: 'YYYY-MM-DD HH:mm',
useCurrent: false useCurrent: false
}); });
$('#id_end').datetimepicker({ $('#datetimepicker_end').datetimepicker({
defaultDate: 'now', defaultDate: 'now',
format: 'YYYY-MM-DD HH:mm' format: 'YYYY-MM-DD HH:mm'
}); });

View File

@ -20,11 +20,11 @@
{% block javascript %} {% block javascript %}
<script type="text/javascript"> <script type="text/javascript">
$(function () { $(function () {
$('#id_start').datetimepicker({ $('#datetimepicker_start').datetimepicker({
format: 'YYYY-MM-DD HH:mm:ss', format: 'YYYY-MM-DD HH:mm:ss',
useCurrent: false useCurrent: false
}); });
$('#id_end').datetimepicker({ $('#datetimepicker_end').datetimepicker({
defaultDate: 'now', defaultDate: 'now',
format: 'YYYY-MM-DD HH:mm:ss' format: 'YYYY-MM-DD HH:mm:ss'
}); });