(Django)使用jquery-forms提交Ajax表单

时间:2010-07-08 19:19:29

标签: jquery ajax django form-submit

我正在尝试将ajax表单提交到我的网页。表格会将用户的电子邮件添加到简报中。我找到了这个解决方案:http://www.tutorialswitch.com/web-development/quick-and-simple-ajax-forms-with-json-responses/现在我正在尝试为django重写它。

所以我有我的表格,包含在主页上:

    <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()

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

2 个答案:

答案 0 :(得分:0)

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

答案 1 :(得分:0)

就像一个想法,我前段时间遇到过类似的问题:http://code.djangoproject.com/ticket/5868