私は 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));
};