在Google App Engine上使用jQuery处理json表单 [英] Handling json Form with jQuery on Google App Engine
问题描述
我在使用GAE python 2.7编写jQuery时遇到了一些问题。 主要问题是jQuery无法捕获服务器返回的json数据。
一个简单的注释表单,没有什么特别的:
< form action =/ postcomment /method =postid =commentform>
< input type =textname =authorid =authoronfocus =if(this.value =='Name:(required)')this.value =''; onblur =if(this.value =='')this.value ='Name:(required)'; {%if name%} value ={{name}}{%else%} value =Name:(required){%endif%} size =22tabindex =1aria-required ='true '/>
< input type =textname =emailid =emailonfocus =if(this.value =='E-Mail:(required)')this.value =''; onblur =if(this.value =='')this.value ='电子邮件:(必填)'; {%email%} value ={{email}}{%else%} value =电子邮件:(必填){%endif%} size =22tabindex =2aria-required = 'true'/>
< input name =submittype =submitid =submittabindex =4value =Submit/>
< / form>
我的jQuery代码(只是使结构更简单):
$(#submit)。click(function(){
$ .ajax({
dataType:'json',
beforeSubmit:function(){
},
timeout:60000,
error:function(request,error){
},
success:function(data ){
var obj = jQuery.parseJSON(data);
// blah blah ...
} // End success
}); //结束ajax方法
});
在服务器端:
class PostComment(BaseHandler):
def post(self):
self.response.headers ['Content-Type'] =application / json
response = {'errorcode':0}
self.response.out.write(json.dumps(response))
结果是:
我点击submit按钮后,My Firefox 3.6浏览器显示:有application / json文件,你想用哪个工具打开它? / p>
我期待jQuery能够捕获这个'json'数据并处理它。但它没有发生。
我相信我几乎在那里,但有些地方是错误的。 / div>
您需要取消表单的默认操作,即提交(取消所有正在运行的JavaScript AJAX查询):
$(#submit)。click(function(){
$ .ajax({
dataType:'json',
beforeSubmit:function(){
},
超时:60000,
错误:函数(请求,错误){
},
成功:函数(数据){
var obj = jQuery.parseJSON(data);
// blah blah ...
} // End success
}); //结束ajax方法
返回false; //取消默认行动。
});
通过从Click处理程序返回 false
浏览器将数据提交给 action
属性中指定的URL的正常表单操作未被执行。
I am having some problems with making jQuery work on GAE python 2.7 . The main problem is jQuery cant catch the json data returned by the server.
A simple comment form with nothing special:
<form action="/postcomment/" method="post" id="commentform">
<input type="text" name="author" id="author" onfocus="if(this.value=='Name: (required)') this.value='';" onblur="if(this.value=='') this.value='Name: (required)';" {% if name %}value="{{ name }}"{% else %}value="Name: (required)"{% endif %} size="22" tabindex="1" aria-required='true' />
<input type="text" name="email" id="email" onfocus="if(this.value=='E-Mail: (required)') this.value='';" onblur="if(this.value=='') this.value='E-Mail: (required)';" {% if email %}value="{{ email }}"{% else %}value="E-Mail: (required)"{% endif %} size="22" tabindex="2" aria-required='true' />
<textarea name="comment" id="comment" cols="100%" rows="10" tabindex="3"></textarea>
<input name="submit" type="submit" id="submit" tabindex="4" value="Submit" />
</form>
My jQuery code (only structure to make it simpler):
$("#submit").click(function() {
$.ajax({
dataType: 'json',
beforeSubmit: function() {
},
timeout: 60000,
error: function(request,error) {
},
success: function(data) {
var obj = jQuery.parseJSON(data);
//blah blah...
} // End success
}); // End ajax method
});
On the server side:
class PostComment(BaseHandler):
def post(self):
self.response.headers['Content-Type'] = "application/json"
response = {'errorcode': 0}
self.response.out.write(json.dumps(response))
The result is: After I click the "submit" button, My Firefox 3.6 browser says: There is "application/json" file, do you want to open it with which tool?
I was expecting jQuery to catch this 'json' data and process it. But it didnt happen.
I believe I am almost there but something is wrong.
You need to cancel the default action of the form, which is to submit (which cancels any running JavaScript AJAX query in progress):
$("#submit").click(function() {
$.ajax({
dataType: 'json',
beforeSubmit: function() {
},
timeout: 60000,
error: function(request,error) {
},
success: function(data) {
var obj = jQuery.parseJSON(data);
//blah blah...
} // End success
}); // End ajax method
return false; // Cancel default action.
});
By returning false
from the click handler, the normal form action, which is for the browser to submit the data to the URL named in the action
attribute, is not executed.
这篇关于在Google App Engine上使用jQuery处理json表单的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!