# materialize-css-form
Materializecss for Django Form
A simple Django template tag to work with [Materializecss](http://materializecss.com/)
## Install
```
pip install django-materializecss-form
```
[on pypi](https://pypi.python.org/pypi/django-materializecss-form)
[on GitHub](https://github.com/kalwalkden/django-materializecss-form)
Add to INSTALLED_APPS:
```
INSTALLED_APPS = (
'materializecssform',
...
)
```
Add Materializecss to your project:
In your base.html:
```
<head>
{% block css %}
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.1/css/materialize.min.css" integrity="sha256-qj3p6P1fJIV+Ndv7RW1ovZI2UhOuboj9GcODzcNFIN8=" crossorigin="anonymous" />
{% endblock css %}
</head>
```
```
<body >
{% block javascript %}
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.1/js/materialize.min.js" integrity="sha256-SrBfGi+Zp2LhAvy9M1bWOCXztRU9Ztztxmu5BcYPcPE=" crossorigin="anonymous"></script>
<script>
$(document).ready(function(){
// Initialize materialize data picker
$('.datepicker').datepicker({'format': 'yyyy-mm-dd'});
$('select').formSelect();
});
</script>
{% endblock javascript %}
...
</body>
```
## Usage
Use it like this, simple.
{% load materializecss %}
### All the form
{{ form|materializecss }}
### Individual field
{{ form.<<field name>> | materializecss }}
### Custom size (default is 's12')
{{ form|materializecss:'m6' }}
### Icons support
This is most useful for adding a descriptive icon when you are creating a custom layout by building the form one field at a time. Substitue FIELD_NAME below with one of the field names from your form.
```html
{{ form.FIELD_NAME|materializecss:'s12 m6, icon=person' }}
{{ form.FIELD_NAME|materializecss:'custom_size=s12 m6, icon=person' }}
```
### Note about `DateTimeField`
Input field is rendered as a *datetime-local* type, this lets the user easily enter both a date and a time. As this field requires ISO-8601 format, your main project settings need to include the ISO format in order for the form to interpret this field valid:
```
from django.conf.global_settings import DATETIME_INPUT_FORMATS
# ISO 8601 datetime format to accept html5 datetime input values
DATETIME_INPUT_FORMATS += ["%Y-%m-%dT%H:%M:%S", "%Y-%m-%dT%H:%M"]
```
## Demo
## Help
### Widget
- TextInput
- Textarea
- CheckboxInput
- RadioSelect
- Select
- SelectMultiple
- CheckboxSelectMultiple
- Filefield
- DateField
- DateTimeField
## Inspired by
[django-bootstrap-form](https://github.com/tzangms/django-bootstrap-form)
## Originally Built By
Florent CLAPIÉ
[https://pypi.org/user/florent1933/] https://pypi.org/user/florent1933/
Materializecss for Django Form
A simple Django template tag to work with [Materializecss](http://materializecss.com/)
## Install
```
pip install django-materializecss-form
```
[on pypi](https://pypi.python.org/pypi/django-materializecss-form)
[on GitHub](https://github.com/kalwalkden/django-materializecss-form)
Add to INSTALLED_APPS:
```
INSTALLED_APPS = (
'materializecssform',
...
)
```
Add Materializecss to your project:
In your base.html:
```
<head>
{% block css %}
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.1/css/materialize.min.css" integrity="sha256-qj3p6P1fJIV+Ndv7RW1ovZI2UhOuboj9GcODzcNFIN8=" crossorigin="anonymous" />
{% endblock css %}
</head>
```
```
<body >
{% block javascript %}
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.1/js/materialize.min.js" integrity="sha256-SrBfGi+Zp2LhAvy9M1bWOCXztRU9Ztztxmu5BcYPcPE=" crossorigin="anonymous"></script>
<script>
$(document).ready(function(){
// Initialize materialize data picker
$('.datepicker').datepicker({'format': 'yyyy-mm-dd'});
$('select').formSelect();
});
</script>
{% endblock javascript %}
...
</body>
```
## Usage
Use it like this, simple.
{% load materializecss %}
### All the form
{{ form|materializecss }}
### Individual field
{{ form.<<field name>> | materializecss }}
### Custom size (default is 's12')
{{ form|materializecss:'m6' }}
### Icons support
This is most useful for adding a descriptive icon when you are creating a custom layout by building the form one field at a time. Substitue FIELD_NAME below with one of the field names from your form.
```html
{{ form.FIELD_NAME|materializecss:'s12 m6, icon=person' }}
{{ form.FIELD_NAME|materializecss:'custom_size=s12 m6, icon=person' }}
```
### Note about `DateTimeField`
Input field is rendered as a *datetime-local* type, this lets the user easily enter both a date and a time. As this field requires ISO-8601 format, your main project settings need to include the ISO format in order for the form to interpret this field valid:
```
from django.conf.global_settings import DATETIME_INPUT_FORMATS
# ISO 8601 datetime format to accept html5 datetime input values
DATETIME_INPUT_FORMATS += ["%Y-%m-%dT%H:%M:%S", "%Y-%m-%dT%H:%M"]
```
## Demo
## Help
### Widget
- TextInput
- Textarea
- CheckboxInput
- RadioSelect
- Select
- SelectMultiple
- CheckboxSelectMultiple
- Filefield
- DateField
- DateTimeField
## Inspired by
[django-bootstrap-form](https://github.com/tzangms/django-bootstrap-form)
## Originally Built By
Florent CLAPIÉ
[https://pypi.org/user/florent1933/] https://pypi.org/user/florent1933/
1 maintainer
Metadata
1 maintainer
Release files for django-materializecss-form-bacchus 1.1.12
For a detailed explanation of source distributions (sdists) and built distributions (wheels), please see the package formats documentation.
Built distribution (wheel)
| File | Interpreter | ABI | Platform | Reset |
|---|---|---|---|---|
| django_materializecss_form_bacchus-1.1.12-py3-none-any.whl | Python 3 | none | any | Details |
Release files / django_materializecss_form_bacchus-1.1.12-py3-none-any.whl
| Download URL | django_materializecss_form_bacchus-1.1.12-py3-none-any.whl |
|---|---|
| Size | 10.4 kB |
| Tags | Python 3 |
|
SHA-256 checksum How to use checksums |
b819347344bb2436bfd9a295ffdf6dc717481fbb35e303838e232f9d20bc4a68
|
|
BLAKE2b-256 checksum How to use checksums |
3bbb77a5aece35094b8553039da4639780540b229f64a785b4e38eeb1368f56b
|
| Upload date | |
|
Uploaded using Trusted Publishing? What is trusted publishing? |
No |
| Uploaded via |
twine/1.12.1 pkginfo/1.4.2 requests/2.20.0 setuptools/40.6.3 requests-toolbelt/0.8.0 tqdm/4.28.1 CPython/3.7.2+
|
Security for django-materializecss-form-bacchus 1.1.12
Provenance
Provenance describes where a file came from. On PyPI, provenance is shared via attestations, which provide a verifiable record of the build or publishing details. View details, limitations and caveats.
No provenance found
None of the files in this release were uploaded with provenance metadata.
A note on package security
PyPI is a repository for distributing packages, not a service for auditing them. While third-party security researchers and our staff do their best to detect and remove malicious packages, PyPI cannot guarantee the quality, security or suitability of any given package.
To learn more about protecting yourself from malicious actors, visit our package security documentation.
