A Django form widget implementing intl-tel-input.
Project description
A fork from https://github.com/charly06/django-intl-tel-input which is a fork from https://github.com/benmurden/django-intl-tel-input A Django form widget based on the jQuery plugin intl-tel-input.
This release is only to make the fork available to install as django-intl-tel-input2
This is a new package, so it doesn’t implement all the features of intl-tel-input. However, it has been stable in testing.
Installation
Install from PyPI.
pip install django-intl-tel-input2
Add intl-tel-input to your INSTALLED_APPS, so Django can find the init script.
...
INSTALLED_APPS += ('intl_tel_input',)
...
Usage
Simply add IntlTelInputWidget to your form field. It will add a visible text input field and a hidden input field.
from intl_tel_input.widgets import IntlTelInputWidget
class MyForm(forms.ModelForm):
class Meta:
model = MyModel
fields = ['foo', 'bar']
widgets = {
'bar': IntlTelInputWidget()
}
...
With a standard form:
class MyForm(forms.Form):
tel_number = forms.CharField(widget=IntlTelInputWidget(
visible_input_attrs={
'size': '30',
'class': 'my-css-class',
...
},
hidden_input_attrs={
'class': 'another-css-class',
...
}
))
...
The two arguments visible_input_attrs and hidden_input_attrs can be used to add additional HTML attributes to the visible text input field respectively to the hidden input field.
Form media
If you have included jQuery at the end of your document, then don’t forget to update the template where this widget appears with a {{ form.media.js }}. Put it in a block that allows it to come after jQuery.
If you load jQuery in the head of your document, you needn’t worry about this step - widget media will be inserted right after the field. If you want to keep all JS at the end of your document, you can still use the {{ form.media.js }} tag to achieve that. However, if you use crispy-forms, you need to set include_media = False in order to assure that init.js gets loaded after jQuery and consequently to avoid JS errors:
class MyForm(forms.Form):
def __init__(self, *args, **kwargs):
...
self.helper = FormHelper()
self.helper.include_media = False
...
If you use self.helper.include_media = False in your form, you have to add {{ form.media.css }} to your template where this widget appears in order to load intlTelInput.css.
If you need to load all JS in the head, you can make the init.js script wait for the document to be ready with the following snippet.
jQuery(document).ready(
{{ form.media.js }}
);
All this assumes your form context variable is called form.
Options
The widget can be invoked with most keyword arguments which translate to the options available in the jQuery plugin intl-tel-input.
- allow_dropdown
Type: Boolean Default: True
Example usage:
class MyForm(forms.Form): tel_number = forms.CharField(widget=IntlTelInputWidget( allow_dropdown=False, )) ...
- auto_hide_dial_code
Type: Boolean Default: True
- auto_placeholder
Type: String Default: "polite"
- custom_placeholder
This option is not implemented yet.
- dropdown_container
Type: String Default: ""
- exclude_countries
Type: List Default: []
Example usage:
class MyForm(forms.Form): tel_number = forms.CharField(widget=IntlTelInputWidget( exclude_countries=['at', 'de', 'ch'], )) ...
- format_on_display
Type: Boolean Default: True
- auto_geo_ip
Type: Boolean Default: False
This option represents geoIpLookup. If set to True, the user’s location is lookup up. In order to lookup the user’s location, https://freegeoip.net/json/ is used.
- initial_country
Type: String Default: ""
- national_mode
Type: Boolean Default: True
- placeholder_number_type
Type: String Default: "MOBILE"
- only_countries
Type: List Default: []
- preferred_countries
Type: List Default: ['us', 'gb']
- separate_dial_code
Type: Boolean Default: False
Project details
Release history Release notifications | RSS feed
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
File details
Details for the file django-intl-tel-input2-0.2.0.tar.gz
.
File metadata
- Download URL: django-intl-tel-input2-0.2.0.tar.gz
- Upload date:
- Size: 6.7 kB
- Tags: Source
- Uploaded using Trusted Publishing? No
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | 0e6a42c3fc06d66e7bc901602143eee5409f6070e40859076cad6b768e681ea7 |
|
MD5 | 8c40fd6a0a7b383111b4745ebd4f36fe |
|
BLAKE2b-256 | 07d3c65b8e91b26151b3d353c0fc5297f9b0a9ec31f7da6f7fdca6c0716082f9 |