使用jQuery的Django模板：现有页面上的Ajax更新

我有一个Google App Engine，它有一个表单。当用户点击提交按钮时，AJAX操作将被调用，并且服务器将输出一些内容以附加到它所来自的页面的末尾。如何，我有一个Django模板，我打算使用jQuery。我有以下看法：使用jQuery的Django模板：现有页面上的Ajax更新

<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将被调用。

现在我想在表单后面显示'result'变量的内容，我该怎么做？

来源

2008-10-16 Graviton

无法测试代码，结果如何？你检查过AJAX调用返回的结果吗？我建议你用萤火虫运行Firefox和日志AJAX结果Firebug控制台，看看你会得到什么：

//... 
     success: function(result) { 
     console.log(result); 
     $('#SubmitForm').after("<div><tt>" + 
// ...

您也可以使用Firebug净面板查看被来回传递。

此外，“simplejson.dumps（result）”的结果是什么？

来源

2008-11-05 21:53:18 Seamus

这里是我的成功函数的例子

success: function(json){ 
       $('#gallons_cont').html(json['gallons']); 
       $('#area_cont').html(json['area']); 
       $('#usage_cont').html(json['usage']) 
       $('#results_json').show('slow');    
      },

请注意，你必须使用萤火虫或类似的东西来调试，因为可能有一些问题，序列化，这将引发和错误，但不会vieweable除非你使用类似萤火虫或执行.ajax错误

来源

2009-05-07 02:26:37 Rasiel

使用jQuery的Django模板：现有页面上的Ajax更新

回答

相关问题