I have a Google App Engine that has a form. When the user clicks on the submit button, AJAX operation will be called, and the server will output something to append to the end of the very page where it comes from. How, I have a Django template, and I intend to use jquery. I have the following view:
<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>
Here's the script in 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>" );
}
} );
};
And here's my controller code:
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))
As you can see, when the user clicks on the submitbutton, the controller method Mainpage.post will be called.
Now I want to display the content of the 'result' variable right after the form, how can I do it?