1

我对 Ajax 完全陌生,但试图获得一个用于 django 工作的反馈模块,这是一个可供用户提交反馈的选项卡。

这是模板:

<div id="feedback_button" class="white left normal"><a href="/feedback/">feedback</a></div>
<div class="hiding">
<div id="feedback_popup" class="colorbox" style="width: 500px">
    <h1>Feedback</h1>
    {% if not feedback_text %}
        <p style="margin-bottom: 0">We would be happy to consider any feedback you have.</p>
    {% else %}
        {{feedback_text}}
    {% endif %}
    <form class="feedback" action="{% url feedback.views.handle_ajax %}" method="POST" style="margin: 0">{% csrf_token %}
        <div style="display: none"><input name="body" value="..."/></div>
        <label for="email">email (optional)</label>
            <input name="email" value="{{user.email}}"/>
             <div class="email error"> </div>
        <label for="subject">subject (optional)</label>
            <input name="subject"/>
             <div class="subject error"> </div>
        <label for="text">message</label>
            <textarea name="text"></textarea>
            <div class="text error"> </div>
        <div class="buttons">
            <button>Send</button>
        </div>
    </form>
    <div class="thanks hiding">Thank you for your feedback!</div>
    <div class="general error hiding"></div>
</div>
</div>
<script>
    $(function(){
        feedback.init({
            'button':$('#feedback_button'),
            'drop':$('#feedback_drop'),
            'popup':$('#feedback_popup')
        });
        if (document.cookie == "") {
            // CSRF protection requires a cookie to be set already.
            $('#feedback_button').hide();
        }
    });
</script>

我看到了反馈按钮,但是当我单击它时,什么也没有发生。因为我是 jquery/ajax 的新手,不太确定从哪里开始调试这个......有什么提示吗?

这是我在base.html模板中调用它的地方:

<body class="{% block body_class %}{% endblock %}">
    {% include "feedback/button.html" %}
        <div id="wrapper">

这是相关的jQuery:

var feedback = {};
feedback.init = function(config) {
    if (!(config.button && config.drop && config.popup))
        throw "invalid params";
    config.popup.find('form.feedback').ajaxSubmit({
        'onstart':function(){
            config.popup.addClass('loading');
        },
        'onend':function(){
            config.popup.removeClass('loading');
        },
        'onerror':function(why){
            alert('Error! '+why);
        },
        'onsuccess':feedback.done(config)
    });

    config.button.click(function(){
        config.drop.removeClass('hiding');
        config.popup.removeClass('hiding');
        config.popup.find('input[name=email]').focus();
    });
    config.popup.find('.close').click(feedback.closeit(config));
};
4

2 回答 2

0

ajaxSubmit() 将立即提交表单。使用 ajaxForm() 和:提交按钮,或连接按钮单击事件以执行 submit()。或者在按钮单击事件期间执行 ajaxSubmit()。像这样的东西应该可以工作(没有尝试过)......

feedback.init = function(config) {
    if (!(config.button && config.drop && config.popup))
        throw "invalid params";
    config.popup.find('form.feedback').ajaxForm({
        'onstart':function(){
            config.popup.addClass('loading');
        },
        'onend':function(){
            config.popup.removeClass('loading');
        },
        'onerror':function(why){
            alert('Error! '+why);
        },
        'onsuccess':feedback.done(config)
    });

    config.button.click(function(){
        config.drop.removeClass('hiding');
        config.popup.removeClass('hiding');
        config.popup.find('input[name=email]').focus();
        config.popup.find('form.feedback').ajaxSubmit();
    });
    config.popup.find('.close').click(feedback.closeit(config));
};
于 2012-11-18T15:13:00.673 回答
0
  • 您的 JS 附件/static/uni_form/uni-form.jquery.js未加载 - 返回 403 Forbidden

  • 在 main.js 中的config.popup.find('form.feedback').ajaxSubmit({ajaxSubmit 行返回一个错误。也许您会将feedback.initmain.js 或所有 main.js 放在一个$(document).ready(function(){...});etc 之间......但是请确保 ajaxSubmit 在该执行点可用。

于 2012-11-18T15:07:09.083 回答