2012-12-17 67 views
0

在我的django應用程序中,我有一個表單,我要求用戶輸入電子郵件地址和用戶名。與Django的Jquery表單驗證

我希望能夠檢查用戶名或電子郵件地址是否已經存在並引發錯誤。但我想這樣做,而不重新加載我的網頁,所以使用JavaScript或JQuery。

我的第一個想法是將是這樣的(用戶名):

HTML:

<form method="post" onsubmit="return validateForm();"> 
    {% csrf_token %} 

     <div id='error_message'></div> 
     <input class='username' type="text" name="username" value=""/> 

    <button type="submit">Valider</button> 

    </form> 

在我views.py:

def myview(request): 
     users = User.objects.all() 
     return render_to_response('mytemplate.html', 'users':users, context_instance=RequestContext(request)) 

然後在我的模板:

<div class='search'> 
    {% for user in users %} 
    <input type='hidden' value='{{user.username}}' 
    {% endfor %} 
    </div> 

然後,在js中:

function validateForm() { 
    var value = $('.username').val() 

    if(// find 'value' in all the <input type='hidden'> ) { 
    var error = 'Username already exists'; 
    $("#error_message").html(error); 
    return false; 
    } 
}; 

我覺得這很複雜。有一種更簡單的方法來實現這一點嗎?

感謝您的幫助。

+0

你可以把通過jQuery的Ajax調用,檢查用戶是否存在和視圖可以使用用戶名並將此結果返回到腳本。 – Jingo

回答

5

很抱歉,但是您的方法在安全性和效率方面非常糟糕。您正在披露用戶的所有用戶名(無論是否隱藏輸入)。您應該檢查一些已建成的身份驗證的應用程序e.g django-userneadjango-allauth

我會去與AJAX驗證:

首先給你的形式的ID例如my_form

<script> 
    $('#my_form').submit(function(){ 
     var username = $('#username').val(); 
     if (username == ''){ 
     alert('please enter username'); 
     return false; 
     } 

     $.ajax({ 
       type: "POST", 
       url: "{% url auth_validate %}", 
       data: {'username': $('#username').val(), 'csrfmiddlewaretoken': '{{csrf_token}}'}, 
       dataType: "text", 
       success: function(response) { 
         var response = $.parseJSON(response); 
         if (response.success){ 
          return true; 
         } 
         else{ 
          alert(response.error); 
         } 
       }, 
       error: function(rs, e) { 
         alert(rs.responseText); 
       } 
      }); 
    }) 
</script> 

urls.py添加auth_validate網址:

url(r'^auth_validate/$', 'myapp.views.auth_validate', name='auth_validate'), 

現在myapp.views

from django.http import HttpResponse 
from django.utils import simplejson 
from django.utils.translation import ugettext_lazy as _ 

def auth_validate(request): 
    error = '' 
    success = False 
    if request.method == 'POST': 
     username = request.POST.get('username', None) 
     if not username: 
      error = _('Please enter username') 
     elif User.objects.filter(username__exact=username).exists(): 
      error = _('Sorry this username is already taken') 
     else: 
      success = True 

    ajax_vars = {'success': success, 'error': error} 
    return HttpResponse(simplejson.dumps(ajax_vars), 
        mimetype='application/javascript') 
+0

謝謝你的幫助。我會在第一部分中使用post方法。在我看來,我將不得不檢查'用戶名'是否已被使用。我沒有得到的是我如何得到迴應我的腳本(如果它正在使用或不)?我認爲你的ajax請求的第二部分處理,但我不明白它的工作原理。你能給我一些解釋嗎? – Marcolac

+0

@Marcolac我已經添加完整的示例代碼。我剛剛嘗試驗證用戶名,但您可以使用類似的方式驗證更多內容。希望這會有所幫助。 –

+0

非常感謝!它幫助我很多。 – Marcolac