Question

Currently I am trying to implement a login validation system. I am using ajax so that users can get a response without being redirected to another page. My ajax function sends email and password that user has inputted, and get message in callback function, which can be in three types: email, password, or the actual HttpResponse object. But I have no idea how to render the given http response object using ajax and jquery. Is location.href an option? I am pasting the code below.

In javascript:

function loginSubmit(email, password) {
    var d= "email=" + email + "&password=" + password;
    $.ajax({
        url: "/login",
        type: "POST",
        dataType: "text",
        data: d,
        success: function(m) {
            if (m == "email") {
                $("#emailMessage").html("There is no account associated with this email address.");
                $("#emailError").show();
                $("#emailError").fadeOut(5000, function() {});
            } else if (m == "password") {
                $("#emailMessage").html("There is no account associated with this email address.");
                $("#emailError").show();
                $("#emailError").fadeOut(5000, function() {});
            } else {

            }
        }
    });
}

in view function:

def login(request):
    json = request.POST
    e = json['email']
    p = json['password']

    u = User.objects.filter(email=e)

    if (len(u)):
        up = User.objects.filter(email=e, password=p)
        if (len(up)):
            return render_to_response('profile.html', context_instance=RequestContext(request))
        else:

            data = "password"
            c = RequestContext(request, {'result':data})
            t = Template("{{result}}")
            datatype=u"application/javascript"
            return HttpResponse(t.render(c), datatype)
    else:
        data = "email"
        c = RequestContext(request, {'result':data})
        t = Template("{{result}}")
        datatype=u"application/javascript"
        return HttpResponse(t.render(c), datatype)

p.s. Currently I am using a dummy template and HttpResponse to send data to the ajax success callback function. Is there a more efficient way to accomplish this (send back json data)? I will wait for your replies guys!

Answer 1

from django.contrib.auth import authenticate, login as auth_login

def login(request):

    # Use authentication framework to check user's credentials
    # http://djangosnippets.org/snippets/1001/ for auth backend
    user = authenticate(
               email    = request.POST['email'],
               password = request.POST['password'], )

    if user is not None:
        # Use Auth framework to login user
        auth_login(request, user)
        return render_to_response('profile.html',
                 context_instance=RequestContext(request))

    else:
        # Return Access Denied
        # Never return bad email/bad password. This is information leakage
        # and helps hackers determine who uses your platform and their emails.
        return HttpResponse("Failed: Bad username or password", status=403)


function loginSubmit(email, password) {
    $.ajax({
        url: "/login",
        type: "POST",
        data: {email:email, password:password},
        success: function(data) {
            var returned_html = $(data);
            $("#target_profile_area").clear().append(returned_html);
        },
        error: function(jqXHR) {
            if (jqXHR.statusCode == 403) {
                $("#loginMessage").text("Your login details are incorrect");
            } else {
                $("#loginMessage").text("Error Contacting Server");
            }
            $("#loginError").show();
            $("#loginError").fadeOut(5000, function() {});
        }
    });
}