在Django表单中警告非ASCII字符

I'm trying to add some client-side Ajax validation of my Django form. I want to warn users, as they are typing in a field, if any of the characters they just inputted are not ascii.

我正在尝试添加一些我的Django表单的客户端Ajax验证。我想警告用户,因为他们在字段中输入,如果他们刚刚输入的任何字符不是ascii。

I originally put the basic python to check for ascii characters in my form's clean method. I don't want to do that, though, as I don't want to produce an error but rather just give a warning message and let the user continue with the rest of the form.

我最初使用基本的python来检查我的表单中的ascii字符的clean方法。但是,我不想这样做,因为我不想产生错误,而只是发出警告信息并让用户继续使用表单的其余部分。

try:
    field_value.decode('ascii')
except UnicodeEncodeError:
    #raise forms.ValidationError("Non-ASCII characters may cause issues in registering your data. Consider removing these characters. You may still submit at your own risk.")
    # Just want to show a warning so the user can still submit the form if they wish

I want to show a small warning under the field as the user is typing. I've tried using django-dajax, but am not sure. How can I do this?

我想在用户输入时在字段下显示一个小警告。我尝试过使用django-dajax,但我不确定。我怎样才能做到这一点?

EDIT: To clarify, I want to show the warning before the user submits the form. So, as they are filling out the form...

编辑:为了澄清,我想在用户提交表单之前显示警告。所以,因为他们填写表格......

2 个解决方案

#1

Use JavaScript to validate that form field.

使用JavaScript验证表单字段。

Example (using jQuery):

示例(使用jQuery):

<form>
    <input name="whatever" id="fieldId">
    ...
</form>

<script type="text/javascript">

    /* Define a function to check the form field value */

    function containsAllAscii(str) {
        return  /^[\000-\177]*$/.test(str); // returns true if all are ASCII characters. false otherwise. 
    }

    /* Now a little jQuery */

    $('#fieldId').on('change', function() {
        str = $(this).val();
        is_valid = containsAllAscii(str);

        if (!is_valid) {
            window.alert("There are Non-ASCII characters in the input field");
        }
    });   
</script>

The above code will check the given field's value whenever it changes (i.e. loses focus). You can use .on('keyup', ... instead of .on('change', ... which will check the field's value as the user is typing.

上面的代码将在它改变时检查给定字段的值(即失去焦点)。您可以使用.on('keyup',...而不是.on('change',...)将在用户输入时检查字段的值。

Finally, the error message that is shown is just a browser alert. Which is crappy. You can display a beautiful error message, you just need to learn a little more of jQuery. But I hope I've given you a good starting point.

最后,显示的错误消息只是一个浏览器警报。这很糟糕。您可以显示一个漂亮的错误消息,您只需要了解更多jQuery。但我希望我给你一个很好的起点。

Credits:

The code for containsAllAscii function is taken from this answer by Juan Mendes.

containsAllAscii函数的代码取自Juan Mendes的答案。

#2

In your django form, create a custom field and take advantage of the media class.

在您的django表单中,创建自定义字段并利用媒体类。

from django import forms

class MyWidget(forms.TextInput):
    class Media:
        css = {
            'all': ('pretty.css',)
        }
        js = ('animations.js', 'actions.js')

and set the js to the javascript file you will use for validation. something along the lines of the the other answer

并将js设置为您将用于验证的javascript文件。与其他答案一致的东西

https://docs.djangoproject.com/en/1.9/topics/forms/media/

#1