View:
def tryit(request):
"""
Create a form on the fly with jquery
"""
if request.POST:
try:
#if from the new form return something to display there
postdic = request.POST['p_data']
return HttpResponse(simplejson.dumps({'response': 'hi '+postdic}),
mimetype="application/json")
except:
pass
try:
#if from the old form create the new form
postdic = request.POST['post_data']
chunk = """<form id="p_form" method="POST" action="/web/tryit/">
<input class="mutt" type="text" name="some"/>
<input type="submit" name="Register" class ="sub" value="Submit">
</form> </p>"""
return HttpResponse(simplejson.dumps({'response_text':chunk}),
mimetype="application/json")
except:
pass
t = loader.get_template('web/tryit.html')
c = RequestContext(request,{'request':request})
return HttpResponse(t.render(c))`
Template:
`{% extends "base.html" %}
{% block head %}
<script type="text/javascript" src="/sitemedia/js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var doit = function() {$('#post_form').submit(function(event){
event.preventDefault(); // cancel the default action
var form = this;
var data = {};
data.post_data = $(form).find('input[@name=our_text]').val();
$.post("/web/tryit/",
data,
function(responseData) {
//create the new form in the empty id "toappend"
$("#toappend").replaceWith(responseData.response_text);
//makesure the javascript knows about the new form
doit_newform();
},
"json");
});}
var doit_newform = function() {$('#p_form').submit(function(event){
event.preventDefault(); // cancel the default action
var form = this;
var data = {};
data.p_data = $(form).find('input[@name=some]').val();
$.post("/web/tryit/",
data,
function(responseData) {
//show the new response from the server
$(".mutt").attr('value',responseData.response);
},
"json");
});}
doit();
});
</script>
{% endblock %}
{% block centercontent %}
<form id="post_form" method="post" action="/web/tryit/">
Text: <input id="hash" type="text" name="our_text" />
<input type="submit" value="Add" />
</form>
<p id="toappend"></p>
{% endblock %}
Comments