Django: Использование виджета textarea со счетчиком символов / ограничителем javascript?

Question

Я пытаюсь использовать запись формы textarea, в которой у меня есть некоторый код javascript для подсчета и ограничения количества символов, чьи max_length и size являются динамическими (то есть эти атрибуты могут изменяться после создания модели).

Чтобы включить эту функцию в виджет textarea формы django, я должен был создать собственный виджет, хотя я не уверен, как в действительности связать код javascript с шаблоном. Для изменения размера текстовой области, я полагаю, я бы передал переменную в создание формы из представления, чтобы сгенерировать экземпляр виджета текстовой области.

В противном случае сейчас я просто создаю входные данные в шаблоне в формате html / js, затем отправляю данные POST в представление django и извлекаю их с помощью getitem , а затем сохраняю данные непосредственно в моих моделях. , Что, конечно, работает, но не очень django'y и, возможно, каким-то образом уязвимо без встроенной проверки django и чистых функций данных.

Итак, два вопроса: (a) Если я создаю собственный виджет формы django, как мне применить мою функцию javascript к полям textarea в шаблоне (включая "onkeypress = jstextcounter ..." ") и (b) Если я продолжу просто извлекать данные поста в виде без формы django, существует ли уязвимость и что я должен сделать, чтобы гарантировать правильность данных? (страница уже требует входа пользователя, а не публичного поля для комментариев)

Или, может быть, кто-то создал такой виджет формы раньше и знает где-нибудь хороший фрагмент?

Приветствия ...

EDIT Так что, благодаря помощи MovieYoda, я получил эту работу и немного перечитал динамические формы в django. И с заменой% d я могу динамически изменять атрибут maxChars для моей функции js.

В Forms.py у меня есть:

text=forms.CharField(max_length = 1000, widget=forms.widgets.Textarea())

def __init__(self, *args, **kwargs):
     size = kwargs.pop('size')
     maxChars = kwargs.pop('maxChars') 
     super(MyForm, self).__init__(*args, **kwargs)
     self.fields['text'].widget.attrs['onkeypress'] = 'return textCounter(this, this.form.counter, %d);' % maxChars
     self.fields['text'].widget.attrs['rows'] = size
     self.fields['text'].widget.attrs['cols'] = '40'

Где функция js 'textCounter' в шаблоне ограничивает количество символов, используя переменную maxChars.

<script type="text/javascript">

function textCounter( field, countfield, maxLimit) {
  if ( field.value.length > maxLimit )
  {
    field.value = field.value.substring( 0, maxLimit );
    return false;
  }
  else
  { 
    countfield.value = maxLimit - field.value.length;
  }
}
</script>

И в представлении создайте форму со значениями kwargs:

FormInstance = MyForm(size=1, maxChars=5)

Answer 1

(а) Если я создаю собственный виджет формы Django, как мне применить мой JavaScript функция для полей textarea в шаблон (включает в себя "onkeypress = jstextcounter ...") и

Из того, что я смог понять, вы хотите определить обработчики javascript для ваших элементов формы? Вот как можно подойти к этому -

In Forms.py

class Search(forms.Form):
 se=forms.CharField(widget=forms.TextInput(attrs={'onClick':'return jscode();'}))

Теперь визуализируйте вашу форму как обычно. В своем js-файле напишите эту функцию-обработчик jscode () и заставьте ее делать то, что вы хотите.

(b) Если я продолжу просто получать данные поста в представлении без форма django, есть ли уязвимость и что я должен сделать, чтобы обеспечить данные достоверны?

Вторая часть также может быть легко обработана. В вашем файле forms.py определите эти функции-члены, для которых вы хотите выполнить некоторую проверку данных. Вы можете сделать это так -

class Search(forms.Form):
 se=forms.CharField(widget=forms.TextInput(attrs={'onClick':'return jscode();'}))
 def clean_se(self):
    #do your validaton here. In case of error raise ValidationError.
    raise forms.ValidationError('Passwords do not match.')

Обратите внимание, что чистые фн. должен быть в этом формате - clean_<field_to_be_cleaned>. Вот оно se. так что ...

Помимо проверки @login_required - которая обеспечивает доступ к вашему представлению вошедшему в систему пользователю, вам необходимо использовать csrf_token в шаблонах форм и urlencode ваших данных (если пользователь отправляет некоторые данные через форму ). Теперь ты готов идти ...

Answer 2

Эта библиотека jQuery делает то, что вам нужно. Он показывает пользователю, сколько символов осталось, а также ограничивает ввод.

Загрузите и обратитесь к библиотеке здесь и используйте следующий код для ее вызова:

<script type="text/javascript">
    $(document).ready(function () {
        $("#textarea1").CharacterCount({
            charactersRemainingControlId: "remainingCount1"
        });
    });
</script>       

<textarea id="textarea1" name="textarea1" cols="20" rows="3" maxlength="10"></textarea>

The number of characters left is: <span id="remainingCount1">0</span>