I couldn't find any existing library to do this easily, so I use a workaround.
Django form errors are in list format. Its difficult to transfer a list of dict from Django to JS. I have a function that comes in handy. This function (convertErrorsToDict) concatenates all errors per parameter together into 1 error.:
views.py:
def convertErrorsToDict(errors): #previously errors={f1:[er1]}. make it {f1:'er1'} so we can render nicely
#converts form errors from list to dictionary
errors2={}
for f in errors:
errors2[f]='.'.join(errors[f])
return (errors2)
def setPassword(request):
your_form=FormName();
context={}
errors=convertErrorsToDict(your_form.errors)
context['errors']=errors;
return render(request,'htmlFileName.html',context)
FileName.html:
{% load jsonify %}
<script type="text/javascript">
var errors={{errors|jsonify}};
</script>
FileName.js
In js file we can now directly use errors as a variable.
console.log(errors.para1) //para1 is first para in the form. eg first_name
console.log(errors.para2)
This feature is useful when we need complete control on form errors content.