2010-07-08 97 views
0

我想添加ajax表单提交到我的网页。表格将添加用户的电子邮件到通讯。我找到了这个解决方案:http://www.tutorialswitch.com/web-development/quick-and-simple-ajax-forms-with-json-responses/,现在我正在尝试将它改写为django。(Django)Ajax表单提交jQuery表单

所以,我有我的形式,包括主页:

<div id="form-newsletter-message"></div> 
    <form action="{% url newsletter_add %}" method="post" class="form-newsletter" id="form-newsletter"> 
     <input type="text" class="form-text" name="email" /> 
     <input type="submit" value="Add" class="form-submit" /> 
    </form> 

,这里是我的application.js,唯一的变化是形式的名称:

function setupAjaxForm(form_id, form_validations){ 
    var form = '#' + form_id; 
    var form_message = form + '-message'; 

    var disableSubmit = function(val){ 
     $(form + ' input[type=submit]').attr('disabled', val); 
    }; 

    $(form).ajaxSend(function(){ 
     $(form_message).removeClass().addClass('loading').html('Loading...').fadeIn(); 
    }); 

    var options = { 
     dataType: 'json', 
     beforeSubmit: function(){ 
      if(typeof form_validations == "function" && !form_validations()) { 
       return false; 
      } 
      disableSubmit(true); 
     }, 
     success: function(json){ 
      $(form_message).hide(); 
      $(form_message).removeClass().addClass(json.type).html(json.message).fadeIn('slow'); 
      disableSubmit(false); 
      if(json.type == 'success') 
       $(form).clearForm(); 
     } 
    }; 
    $(form).ajaxForm(options); 
} 
$(document).ready(function() { 
    new setupAjaxForm('form-newsletter'); 
}); 

网址:

urlpatterns = patterns('', 
        url(r'^newsletter_add/$', 'views.newsletter_add', name="newsletter_add"), 
) 

现在问题是与视图。基础上的样品.PHP功能,我创造了这个:

if request.method == "POST":  
    try: 
     e = NewsletterEmails.objects.get(email = request.POST['email']) 
     message = _(u"Email already added.") 
     type = "success" 
    except NewsletterEmails.DoesNotExist: 
     logging.debug("nie dodany") 
     try: 
      e = NewsletterEmails(email = request.POST['email']) 
     except DoesNotExist: 
      pass 
     message = _(u"Email added successfully.") 
     type = "success" 
     e.save() 

结果的,这是当我点击提交按钮,我得到了“正在加载...”文本,然后没有什么提交按钮被禁用不断(直到我重新启动浏览器),但我的电子邮件地址被添加。没有响应和萤火虫显示“500内部服务器错误”我在做什么错?

回答

0

您的第一步是看看发生了什么Ajax请求。我建议使用Firebug插件的Firefox来调试Ajax问题,即使我使用Chrome进行常规浏览。在Firebug中启用控制台选项卡并刷新页面。Ajax请求应该显示在那里,然后您可以展开它并查看是否存在是一个呃返回页面。使用Firebug,您可以查看返回的错误页面并找出错误。