2013-05-11 48 views
1

我需要使用JS確認代替django的HTML確認。 Here我找到了我的問題的解決方案,但沒有代碼示例。請幫助並給我一些代碼。 這是我的看法:Django DeleteView JavaScript確認

class EmployeeDelete(DeleteView): 
    model = Employees 
    template_name = "employees_confirm_delete.html" 
    success_url = "/" 

這裏是模型:

class Employees(models.Model): 
    first_name = models.CharField(max_length=20) 
    last_name = models.CharField(max_length=20) 
    active = models.BooleanField() 
    description = models.TextField(max_length=100) 

這裏是URL的一部分,該刪除的對象:/employee/{{ object.id }}/delete

回答

5

下面是代碼,這將做到這一點。

但首先,請確保您的settings.py文件中有'django.middleware.csrf.CsrfViewMiddleware'MIDDLEWARE_CLASSES。它在默認情況下存在,並且可以防止csrf攻擊。

urls.py

urlpatterns = patterns('main.views', 
    # ... 
    url(r'^employee/(?P<pk>\d+)/delete/$', EmployeeDelete.as_view(), name='delete_employee'), 
    # ... 
) 

views.py

from django.views.generic import DeleteView 
from django.contrib.auth.decorators import login_required 
from django.utils.decorators import method_decorator 
from django.http import HttpResponse 
from django.utils import simplejson as json 


class EmployeeDelete(DeleteView): 
    model = Employees 
    template_name = "employees_confirm_delete.html" 
    success_url = "/" 

    # allow delete only logged in user by appling decorator 
    @method_decorator(login_required) 
    def dispatch(self, *args, **kwargs): 
     # maybe do some checks here for permissions ... 

     resp = super(EmployeeDelete, self).dispatch(*args, **kwargs) 
     if self.request.is_ajax(): 
      response_data = {"result": "ok"} 
      return HttpResponse(json.dumps(response_data), 
       content_type="application/json") 
     else: 
      # POST request (not ajax) will do a redirect to success_url 
      return resp 

一些模板,其中的鏈接刪除員工的存在(看here阿賈克斯CSRF保護)

{% for e in employees %} 
    <a class="delete" href="{% url 'delete_employee' e.id %}"> Delete employee {{e.id}}</a> 
{% endfor %} 

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script> 

<script type="text/javascript"> 
    function getCookie(name) { 
     var cookieValue = null; 
     if (document.cookie && document.cookie != '') { 
      var cookies = document.cookie.split(';'); 
      for (var i = 0; i < cookies.length; i++) { 
       var cookie = jQuery.trim(cookies[i]); 
       // Does this cookie string begin with the name we want? 
       if (cookie.substring(0, name.length + 1) == (name + '=')) { 
        cookieValue = decodeURIComponent(cookie.substring(name.length + 1)); 
        break; 
       } 
      } 
     } 
     return cookieValue; 
    } 

    $(document).ready(function() { 

     var csrftoken = getCookie('csrftoken'); 

     function csrfSafeMethod(method) { 
      // these HTTP methods do not require CSRF protection 
      return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method)); 
     } 
     $.ajaxSetup({ 
      crossDomain: false, // obviates need for sameOrigin test 
      beforeSend: function(xhr, settings) { 
       if (!csrfSafeMethod(settings.type)) { 
        xhr.setRequestHeader("X-CSRFToken", csrftoken); 
       } 
      } 
     }); 

     // This function must be customized 
     var onDelete = function(){ 
      $.post(this.href, function(data) { 
       if (data.result == "ok"){ 
        alert("data deleted successfully"); 
       } else { 
        // handle error processed by server here 
        alert("smth goes wrong"); 
       } 
      }).fail(function() { 
       // handle unexpected error here 
       alert("error"); 
      }); 
      return false; 
     } 

     $(".delete").click(onDelete); 
    }); 
</script> 

您只需要自定義onDelete js函數的行爲。

+0

很酷!以及如何使對話窗口確認? – 2013-05-11 15:08:52

+0

你可以使用像http://myclabs.github.io/jquery.confirm/這樣的確認(或者用javascript/jquery自己編碼) – kristian 2015-05-03 20:39:38