带有 jquery 的 Django 模板：现有页面上的 Ajax 更新
Posted
技术标签:
【中文标题】带有 jquery 的 Django 模板：现有页面上的 Ajax 更新【英文标题】：Django template with jquery: Ajax update on existing page 【发布时间】：2010-09-17 13:33:45 【问题描述】：我有一个带有表单的 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。
现在我想在表单后面显示“结果”变量的内容，我该怎么做？
【问题讨论】：
【参考方案1】：如果无法测试代码，您的结果是什么？你检查过 AJAX 调用返回的结果吗？我建议您使用 Firebug 运行 Firefox，并将 AJAX 结果记录到 Firebug 控制台以查看您得到的结果：
//...
success: function( result )
console.log( result );
$('#SubmitForm').after( "<div><tt>" +
// ...
您还可以使用 Firebug 的 Net 面板查看来回传递的内容。
另外，“simplejson.dumps(result)”的结果是什么？
【讨论】：
【参考方案2】：这是我的成功函数的一个例子
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 错误，否则无法查看
【讨论】：
以上是关于带有 jquery 的 Django 模板：现有页面上的 Ajax 更新的主要内容，如果未能解决你的问题，请参考以下文章
如何使用 jQuery 和 Django 分页附加数据页面？
在 django 模板中使用带有隐藏表行的 jQuery 可排序
我无法从 JQuery ajax 调用中加载部分 Django 模板
JQuery Mobile 1.4.0 - 从 Javascript 打开多页模板页面 [重复]