在Django中使用Ajax（1.10）

Question

我無法通過django（1.10）發送表單而無需刷新頁面。我已經搜索了Stackoverflow上的其他相關問題，但沒有成功。

這是我的AJAX請求：

$(document).on('submit', 'signup-form', function(e){ 
     e.preventDefault(); 
     $.ajax({ 
     type: 'POST', 
     url: '{% url "accounts:signup" %}', 
     data: { 
      firstname:$('#firstname').val(), 
      lastname:$('#lastname').val(), 
      email:$('#email').val(), 
      password1:$('#password1').val(), 
      password2:$('#password2').val(), 
      username:$('#username').val(), 
      csrfmiddlewaretoken:$('input[name=csrfmiddlewaretoken]').val(), 
     }, 
     success:function(){ 
      alert('done'); 
     } 
     }) 
    }); 

這是我的形式：

<form id="signup-form" class="casemedic-color"> 
    {% csrf_token %} 
    <label><b>E-mail and Username:</b></label> 
    <br> 
    <input class="input-red input-shadow" id="email" type="email" name="email" style="max-width:150px;" placeholder="e-mail">&nbsp;<input class="input-red input-shadow" type="username" id="username" name="username" style="max-width:150px;" placeholder="username"> 
    <br> 
    <label><b>First name and Last name:</b></label> 
    <br> 
    <input class="input-red input-shadow" id="firstname" type="text" name="firstname" style="max-width:150px;" placeholder="first name">&nbsp;<input class="input-red input-shadow" type="text" id="lastname" name="lastname" style="max-width:150px;" placeholder="last name"> 
    <br> 
    <label><b>Password:</b></label> 
    <br> 
    <input class="input-red input-shadow" id="password1" type="password" name="password1" placeholder="password"> 
    <br> 
    <label><b>Confirm Password:</b></label> 
    <br> 
    <input class="input-red input-shadow" id="password2" type="password" name="password2" placeholder="confirm"> 
    <br> 
    <br> 
    <button class="btn casemedic-button" type="submit"><i class="fa fa-user-plus" aria-hidden="true"></i>&nbsp;Sign up</button> 

    <br> 
    <br> 
    </form> 

這是我的視圖的功能。 （在這種情況下，它應該仍然刷新頁面，但它甚至不能接收刷新請求。） 此功能位於名爲accounts的應用程序內。 （帳戶：註冊）

def signup(request): 
    if request.method == 'POST': 
     if request.POST['username'] and request.POST['password1'] and request.POST['password2'] and request.POST['firstname'] and request.POST['lastname'] and request.POST['email']: 
      if request.POST['password1'] == request.POST['password2']: 
       try: 
        user = User.objects.get(username=request.POST['username']) 
        return render(request, 'firstpage.html', {'error':'Username has alredy been taken'}) 
       except User.DoesNotExist: 
        user = User.objects.create_user(username=request.POST['username'].lower(), password=request.POST['password1'], first_name=request.POST['firstname'], last_name=request.POST['lastname'], email=request.POST['email']) 

        user_ex = UserEx(user=user) 
        user_notifications = UserNotification(user=user) 
        user_likes = UserLike(user=user) 
        user_saves = UserSave(user=user) 

        user_ex.save() 
        user_notifications.save() 
        user_saves.save() 
        user_likes.save() 

        login(request, user) 

        return redirect('handler:home') 
      else: 
       return render(request, 'firstpage.html', {'error':'Passwords didn\'t match'}) 
     else: 
      return render(request, 'firstpage.html', {'error':'Please, fill in the form properly.'}) 
    else: 
     return render(request, 'firstpage.html') 

這是網址：

url(r'^signup/', views.signup, name='signup'), 

Answer 1

當然，這是可能的。

但是，您的任何輸入都沒有id屬性，因此您所有的jQuery選擇器都會失敗。輸入輸入ID，或使用其他類型的選擇器（例如[name="whatever"]）。