我尝试制作一个基本的聊天应用程序,该应用程序将显示在没有页面刷新的情况下发送的消息,但出于某种原因,我无法使该javascript运行。
HTML
<form id="chat-form" method="POST" action="/chat/{{ sender.id }}{{ receiver.id }}/post/"> {% csrf_token %}
<div id="chat-bottom" class="input-group">
<input id="textbox_message" type="text" class="form-control" placeholder="Type your message" name="textbox_message">
<span class="input-group-btn">
<input id="send" class="btn btn-default pull-right" type="submit" value="Send" name="btn_send"/>
</span>
</div>
AJAX
$('#chat-form').on('submit', function(event){
event.preventDefault();
$.ajax({
url : '/chat/{{ sender.id }}{{ receiver.id }}/post/',
type : 'POST',
data : { msg : $('#textbox_message').val() },
dataType : 'json',
success : function(json){
$('#textbox_message').val('');//clear the chat message box
$('#msg-list').append('<li class="text-right list-group-item">' + json.message + '</li>');// append the new message to the list
var chatlist = document.getElementById('msg-list-div');
chatlist.scrollTop = chatlist.scrollHeight;//scroll down after the message is send
}
error: function(){
alert("Error while sending the message");
}
});
});
views.py
def post_message(request, sender, receiver):
if request.method == 'POST':
if ('textbox_message' in request.POST) and request.POST['textbox_message'].strip():
message = request.POST['textbox_message']
Inbox.send_message(request.user, User.objects.get(id = receiver), message)
return JsonResponse({ 'message': message})
return HttpResponse("Deal with this later")
urls.py
urlpatterns = [
url(r'^(?P<sender>\d+)(?P<receiver>\d+)/$', views.index),
url(r'^(?P<sender>\d+)(?P<receiver>\d+)/post/$', views.post_message),
]
问题是:为什么没有触发Ajax(它既没有输入成功也没有输入错误调用)以及如何使其工作?
只是旁注:这是我第一次使用Ajax,我也是Django的新手,但我愿意学习并接受任何额外的建议。
提前致谢。