error: [Errno 10053] while submitting ajax form in Django - ajax

Question

I saw a similar error already posted here but that did not help to solve my problem. Besides the OP did not provided any information about what he was doing when he encountered that error (as others have said in the comments).
What I am trying to do ?
I am just trying to register the user to Django with ajax.
What is the problem ?
I get the following error the movement I submit the form:
[15/Jan/2018 17:49:37] "POST /authenticate/register/ HTTP/1.1" 200 14
Traceback (most recent call last):
File "C:\Python27\lib\wsgiref\handlers.py", line 86, in run
self.finish_response()
File "C:\Python27\lib\wsgiref\handlers.py", line 128, in finish_response
self.write(data)
File "C:\Python27\lib\wsgiref\handlers.py", line 212, in write
self.send_headers()
File "C:\Python27\lib\wsgiref\handlers.py", line 270, in send_headers
self.send_preamble()
File "C:\Python27\lib\wsgiref\handlers.py", line 194, in send_preamble
'Date: %s\r\n' % format_date_time(time.time())
File "C:\Python27\lib\socket.py", line 328, in write
self.flush()
File "C:\Python27\lib\socket.py", line 307, in flush
self._sock.sendall(view[write_offset:write_offset+buffer_size])
error: [Errno 10053] An established connection was aborted by the software in your host machine
[15/Jan/2018 17:49:37] "POST /authenticate/register/ HTTP/1.1" 500 59
----------------------------------------
Exception happened during processing of request from ('127.0.0.1', 54896)
Traceback (most recent call last):
File "C:\Python27\lib\SocketServer.py", line 596, in process_request_thread
self.finish_request(request, client_address)
File "C:\Python27\lib\SocketServer.py", line 331, in finish_request
self.RequestHandlerClass(request, client_address, self)
File "C:\Python27\lib\SocketServer.py", line 654, in __init__
self.finish()
File "C:\Python27\lib\SocketServer.py", line 713, in finish
self.wfile.close()
File "C:\Python27\lib\socket.py", line 283, in close
self.flush()
File "C:\Python27\lib\socket.py", line 307, in flush
self._sock.sendall(view[write_offset:write_offset+buffer_size])
error: [Errno 10053] An established connection was aborted by the software in your host machine
My code:
html:
<div class="modal animated" id="signupModal" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-sm">
<form id='registerForm'>
{% csrf_token %}
<div class="modal-content">
<div class="modal-header">
<button class="close">×</button>
</div>
<div class="modal-body">
<input class="form-control" type="email" id="inputEmail">
<input class="form-control" type="text" id="inputUsername">
<input class="form-control" type="password" id="inputPassword">
<input class="form-control" type="password" id="inputCPassword">
</div>
<div class="modal-footer" id="signup-footer">
<button type="submit" class="btn btn-default"> Register </button>
</div>
</div>
</form>
</div>
</div>
Ajax:
$("#registerForm").on('submit', function(e) {
e.preventDefault();
$.ajax({
type: 'POST',
url: "/authenticate/register/",
data: {
'email' : $('#inputEmail').val(),
'username': $('#inputUsername').val(),
'password': $('#inputPassword').val(),
csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val()
},dataType: 'json',
success: function(data){
if (data['errMsg'] != '')
alert(data['errMsg']);
else
alert('Sending confirmation link...');
}, error: function(xhr){
alert('error!');
}
});
});
views.py:
class Register(View):
form_class = signupForm
def post(self, request):
data = {'errMsg': ''}
form = self.form_class(request.POST)
if form.is_valid():
user = form.save(commit=False)
user.is_active = False
to_email = form.cleaned_data['email']
username = form.cleaned_data['username']
password = form.cleaned_data['password']
user.set_password(password)
user.save()
# code to send confirmation email this code is big
else:
data = { 'errMsg': 'Something went wrong.' }
return JsonResponse(data)
The strange thing is that the user gets registered even with that error. But why do I get this error and how would I fix it.

Answer 1

Finally found the solution:
I just moved form tag one step down inside <div class="modal-content"> and it worked. :)
solution:
<div class="modal animated" id="signupModal" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-sm">
<!-- from here to -->
<div class="modal-content">
<form id='registerForm'>{% csrf_token %} <!-- to here -->
<div class="modal-header">
<button class="close">×</button>
</div>
<div class="modal-body">
<input class="form-control" type="email" id="inputEmail">
<input class="form-control" type="text" id="inputUsername">
<input class="form-control" type="password" id="inputPassword">
<input class="form-control" type="password" id="inputCPassword">
</div>
<div class="modal-footer" id="signup-footer">
<button type="submit" class="btn btn-default"> Register </button>
</div>
</form>
</div>
</div>
</div>