Как сделать поле формы числовым только в Django

при использовании Django modelforms у меня есть целое поле которые состоят только из цифр. но в браузере он поставляется в виде текстового поля в котором я могу ввести "символы". Я хочу сделать это только "цифры". Как это сделать ? т. е. пользователи должны иметь возможность вводить только цифры.

мы можем сделать это 1 способом, установив атрибут поля.

1)

def __init__(self,*args,**kwargs):

        super(PropertyForm,self).__init__(*args, **kwargs)        
        self.fields['brokers_phone_number'].widget.attrs['type'] = "number"

это, похоже, не работает. Я использую html 5 и браузер Chrome. Что я делаю не так ? Как это можно сделать лучше ?

5 ответов


Django 1.6 имеет виджет NumberInput, но 1.6 в настоящее время не стабилен.

но вы можете попробовать что-то вроде этого:

from django.forms import ModelForm, CharField, TextInput

class PropertyForm(ModelForm):

    brokers_phone_number = CharField( widget=TextInput(attrs={'type':'number'}))

    class Meta:
     ...

вот еще одно решение:

  • добавить валидаторы в файл модели
  • добавить класс css в поля в форме модели
  • используйте jquery для изменения типа вышеуказанного класса на "номер" при загрузке документа/страницы

В МОДЕЛИ:

    exp_from = models.IntegerField(default=0,
        validators=[
            MaxValueValidator(100),
            MinValueValidator(0)
        ])

    exp_to = models.IntegerField(default=1,
        validators=[
            MaxValueValidator(100),
            MinValueValidator(1)
        ])

в форме модели-добавьте класс jQuery

self.fields['exp_from'].widget.attrs['class'] = "text_type_number"
self.fields['exp_to'].widget.attrs['class'] = "text_type_number"

В ФАЙЛЕ HTML / JS FILE

$(document).ready(function(){
   $('.text_type_number').attr('type', 'number');
});

в конце концов я закончил использование решения на основе jQuery. вопрос. Вместо добавления типа я добавил класс "number" и добавил на него проверку номера jquery. Но это хакерское решение, особенно когда у нас есть html 5 "число" на месте. Если кто-нибудь найдет способ сделать это, пожалуйста, ответьте.

в виде:

 def __init__(self,*args,**kwargs):
    super( PropertyFloorForm, self).__init__(*args, **kwargs)
    self.fields['number_of_units'].widget.attrs['class'] = "number"

в шаблоне

$(document).ready(function() {
    $(".number").keydown(function(event) {
        // Allow: backspace, delete, tab, escape, and enter
        if (event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 ||
            // Allow: Ctrl+A
            (event.keyCode == 65 && event.ctrlKey === true) ||
            // Allow: home, end, left, right
            (event.keyCode >= 35 && event.keyCode <= 39)) {
            // let it happen, don't do anything
            return;
        } else {
            // Ensure that it is a number and stop the keypress
            if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105)) {
                event.preventDefault();
            }
        }
    });
});

Я знаю, что это неудачный старый поток, добавляю это для потомства

чтобы обойти эту проблему, сохраните следующее Как html5type.py

from django import template
register = template.Library()
def html5type(var):
    if isinstance(var, int):
        return 'number'
    else:
        return 'text'  

register.filter('html5type', html5type)

затем, в шаблоне:

{% load html5type %}
<input type={{ field.value | html5type }} ></input>

конечно, вы можете расширить функцию html5type для других типов

предостережение: числовые поля должны иметь значение по умолчанию для работы выше


вместо RegexValidator, дайте проверку в атрибутах форм только как...

class StaffDetailsForm(forms.ModelForm):
    number = forms.CharField(required=True,widget=forms.TextInput(attrs={'class':'form-control' , 'autocomplete': 'off','pattern':'[0-9]+', 'title':'Enter numbers Only '}))

и так далее...

иначе вам придется обрабатывать ошибку в представлениях. Это сработало для меня, попробуйте этот простой метод... Это позволит пользователям вводить только номер только