[Fixed]-Warn on non-ASCII Characters in Django Form

by

0👍

✅

Use JavaScript to validate that form field.

Example (using 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.

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.

Credits:

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

👤xyres

1👍

Use

> <input type="text" pattern="^[\x20-\x7F]+$" id ....>

in html

👤Henryk Antoni Panas

0👍

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

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

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

👤michaelwayman

Leave a comment