问题描述
当使用jQuery表单插件提交我的表单时，目标视图接收到的请求与以标准方式提交表单（没有javascript）时收到的请求不同，并且我的Django模板未按预期呈现。
当以标准方式提交时，模板呈现表单错误（form。[field_name] .errors），而当通过javascript提交时，模板不会呈现。
使用javascript submit，我得到一个允许使用标准提交渲染模板的请求？
这两种情况下收到的请求对象之间的代码和差异如下所示。
感谢
jul
javascript代码：
var is_geocoded = false;
var interval;
$（function（）{
$ b $（＃submit）。click（function（）{
var options = {
beforeSubmit：getPosition，//预先提交回调
成功：showResponse //提交后回调
};
//使用'ajaxForm'
$（'＃addresto'）。ajaxForm（options）;
}）;
}）;
函数getPosition（）{
var geocoder = new的GClientGeocoder（）;
var country = $（＃id_country）。val（）;
var city = $（＃id_city）。val（）;
var postal_code = $（＃id_postal_code）。val（）;
var street_number = $（＃id_street_number）。val（）;
var street = $（＃id_street）。val（）;
var address = street_number +，+ street +，+ postal_code +，+ city +，+ country;
geocoder.getLatLng（地址，函数（点）{
if（point）{
$（＃id_latitude）。val （point.lng（））
is_geocoded = true;
} else {
is_geocoded = true;
}
}）;
interval = setInterval（doSubmit（），500）;
返回false;
函数doSubmit（）{
if（is_geocoded）{
$（＃addresto）。ajaxSubmit（）;
clearInterval（interval）;
Django模板代码：
< form id =addrestoaction =method =POST>
< p>< label for =id_name>名称：< / label> {{form.name.errors}} {{form.name}}< / p>
< p>< label for =id_country>国家：< / p>国家< / label> {{form.country.errors}} {{form.country}}< / p>
< p style =clear：both;>< input type =Submitid =submitvalue =Submit/>< / p>
< / form>
以下是视图接收到的请求与标准提交和javascript submit之间的区别：
xxx @ xxx：〜$ diff javascript_submit standard_submit
7c7
< 'CONTENT_TYPE'：'application / x-www-form-urlencoded; charset = UTF-8'，
---
> 'CONTENT_TYPE'：'application / x-www-form-urlencoded'，
24c24
< 'HTTP_ACCEPT'：'* / *'，
---
> 'HTTP_ACCEPT'：'text / html，application / xhtml + xml，application / xml; q = 0.9，* / *; q = 0.8'，
28d27
< 'HTTP_CACHE_CONTROL'：'no-cache'，
33d31
< 'HTTP_PRAGMA'：'no-cache'，
36d33
< 'HTTP_X_REQUESTED_WITH'：'XMLHttpRequest'，
70c67
< 'wsgi.input'：< socket._fileobject object at 0x891d064> ;,
---
> 'wsgi.input'：< socket._fileobject object at 0x898b09c> ;,
你需要传递json，或xml返回到您的JavaScript并将错误插入到页面中。
您也可以将表单渲染为一个html blob并覆盖当前表单（但这有点复杂，效率不高）
基本上我会使用django的 request.is_ajax（） 方法来确定表单是否使用ajax提交，并为jQuery请求返回json
when submitting my form using jQuery form plugin, the request received by the target view is different than that received when the form is submitted in the standard way (with no javascript), and my Django template does not render as expected.When submitted in the standard way, the template renders the form errors (the "form.[field_name].errors), while it doesn't when submitted via javascript.Using the javascript submit, how can I get a request allowing to render the template as it does using the standard submit?The code and the diff between the request objects received in both cases are shown below.
thanksjul
javascript code:
var is_geocoded = false;
var interval;
$(function(){
$("#submit").click(function() {
var options = {
beforeSubmit: getPosition, // pre-submit callback
success: showResponse // post-submit callback
};
// bind form using 'ajaxForm'
$('#addresto').ajaxForm(options);
});
});
function getPosition() {
var geocoder = new GClientGeocoder();
var country = $("#id_country").val();
var city = $("#id_city").val();
var postal_code = $("#id_postal_code").val();
var street_number = $("#id_street_number").val();
var street = $("#id_street").val();
var address = street_number+", "+street+", "+postal_code+", "+city+", "+country;
geocoder.getLatLng( address, function(point) {
if (point) {
$("#id_latitude").val(point.lat())
$("#id_longitude").val(point.lng())
is_geocoded = true;
} else {
is_geocoded = true;
}
});
interval = setInterval("doSubmit()", 500);
return false;
}
function doSubmit() {
if (is_geocoded) {
$("#addresto").ajaxSubmit();
clearInterval(interval);
}
}
Django template code:
<form id="addresto" action="" method="POST">
<p><label for="id_name">Name:</label>{{form.name.errors}} {{ form.name }} </p>
<p><label for="id_country">Country:</label>{{form.country.errors}} {{ form.country }} </p>
<!-- more stuff -->
<p style="clear: both;"><input type="Submit" id="submit" value="Submit" /></p>
</form>
Here's the difference between the requests received by the view with standard submit and with javascript submit:
xxx@xxx:~$ diff javascript_submit standard_submit
7c7
< 'CONTENT_TYPE': 'application/x-www-form-urlencoded; charset=UTF-8',
---
> 'CONTENT_TYPE': 'application/x-www-form-urlencoded',
24c24
< 'HTTP_ACCEPT': '*/*',
---
> 'HTTP_ACCEPT': 'text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8',
28d27
< 'HTTP_CACHE_CONTROL': 'no-cache',
33d31
< 'HTTP_PRAGMA': 'no-cache',
36d33
< 'HTTP_X_REQUESTED_WITH': 'XMLHttpRequest',
70c67
< 'wsgi.input': <socket._fileobject object at 0x891d064>,
---
> 'wsgi.input': <socket._fileobject object at 0x898b09c>,
The reason the errors do not appear when you submit via ajax is that you aren't refreshing the page.
You'll need to pass json, or xml back to your javascript and insert the errors in to the page that way.
You could also just render the form to a blob of html and overwrite the current form on the page (but this is a little more complicated and isn't as efficient)
basically I would reccomende just using django's request.is_ajax() method to determine if the form is being submitted with ajax, and return json for ajax requests
这篇关于使用jQuery表单插件提交时，使用Django表单发布的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！