Шаблон Django с jquery: обновление Ajax на существующей странице
У меня есть Google App Engine с формой. Когда пользователь нажимает кнопку отправки, будет вызвана операция AJAX, и сервер выведет что-то для добавления в конец той самой страницы, откуда оно пришло. Как? У меня есть шаблон Django, и я собираюсь использовать jquery. У меня такая точка зрения:
<html>
<head>
<title></title>
<script type = "text/javascript" src = "scripts/jquery.js"></script>
<script type = "text/javascript" src = "scripts/scripts.js"></script>
</head>
<body>
welcome
<form id = "SubmitForm" action = "/" method = "POST">
<input type = "file" name = "vsprojFiles" />
<br/>
<input type = "submit" id = "SubmitButton"/>
</form>
<div id = "Testing">
{{thebest}}
</div>
</body>
</html>
Вот сценарий в scripts.js:
$(function() {
$("#SubmitForm").click(submitMe);
});
var submitMe = function(){
//alert('no way');
var f = $('#SubmitForm');
var action = f.attr("action");
var serializedForm = f.serialize();
$.ajax( {
type: 'post',
data: serializedForm,
url: form_action,
success: function( result ) {
$('#SubmitForm').after( "<div><tt>" +
result +
"</tt></div>" );
}
} );
};
А вот мой код контроллера:
from google.appengine.api import users
from google.appengine.ext import webapp
from google.appengine.ext import db
from google.appengine.ext.webapp import template
from google.appengine.api.urlfetch_errors import *
import cgi
import wsgiref.handlers
import os
import sys
import re
import urllib
from django.utils import simplejson
class MainPage(webapp.RequestHandler):
def get(self):
path = os.path.join(os.path.dirname(__file__), 'Index.html')
template_values = {'thebest': 'thebest'}
tmplRender =template.render(path, template_values)
self.response.out.write(tmplRender)
pass
def Post(self):
print >>sys.__stderr__,'me posting'
result = 'grsgres'
self.response.out.write(simplejson.dumps(result))
Как видите, когда пользователь нажимает кнопку отправки, вызывается метод контроллера Mainpage.post.
Теперь я хочу отобразить содержимое переменной «результат» сразу после формы, как я могу это сделать?
Ответы 2
Каковы ваши результаты, не имея возможности протестировать код? Вы проверили результаты, возвращаемые вызовом AJAX? Я бы посоветовал вам запустить Firefox с Firebug и записать результаты AJAX в консоль Firebug, чтобы увидеть, что вы получите:
//...
success: function( result ) {
console.info( result );
$('#SubmitForm').after( "<div><tt>" +
// ...
Вы также можете использовать панель Net в Firebug, чтобы увидеть, что передается туда и обратно.
Кроме того, к чему приводит "simplejson.dumps (result)"?
вот пример моей функции успеха
success: function(json){
$('#gallons_cont').html(json['gallons']);
$('#area_cont').html(json['area']);
$('#usage_cont').html(json['usage'])
$('#results_json').show('slow');
},
обратите внимание, что вам нужно отлаживать с помощью firebug или чего-то подобного, так как может возникнуть некоторая проблема с сериализацией, которая вызовет ошибку, но не будет отображаться, если вы не используете что-то вроде firebug или реализуете ошибку .ajax