0

我正在使用 django 表单来更新一些细节。单击保存更改后,将进行 ajax 调用,执行视图,发送 ajax 响应,执行成功代码 n 页面再次重新加载。n 在重新加载时表单不再有效,执行 from.is_valid() 的 else 部分。

if form.is_valid:
    #do something
    return HttpResponse(simplejson.dumps(response), mimetype='application/json')
else:
    #do something
    return render_to_response('ts.html', {'form': form}, context_instance = RequestContext(request))

我想避免在成功提交表单时重新加载页面并返回 ajax 响应。怎样才能做到这一点?

我已经更改了我的代码,这里是视图、模板和 jquery。

if request.POST:
    if form.valid():
         if credentials.correct():
               resp = {'success': True}
               return HttpResponse(simplejson.dumps(resp), mimetype='application/json')
         else:
              resp = {'success': False}
              return HttpResponse(simplejson.dumps(resp), mimetype='application/json')
    else:
         print "error in form"
         return render(request, 'manage_accounts.html', {'creds': creds, 'form': form})
else:
     form = SomeForm()
     return render(request, 'manage_accounts.html', {'creds': creds, 'form': form})

模板

<form action="/accounts/" method="POST" id="bitlychangeform">
  <div id="ajaxwrapper">
{% csrf_token %}
{{ form.non_field_errors }}
<!--{% include "Change_bitly_form.html" %}-->
{{ form.as_p }}
      <div class="clearfix">
        <label></label>
            <div class="input" style="float:right">
            <input type="submit" id="save" value="Save Changes" class="btn btn-primary  "/>
        </div>
     </div>
  </div>
</form>

查询:

$(function(){
var form = $('#bitlychangeform');
    form.submit(function(e) {
    jQuery("#save").attr('disabled', true)
    jQuery("#ajaxwrapper").load(
          form.attr('action') + ' #ajaxwrapper',
          form.serializeArray(),
          function(data) {
              jQuery("#save").attr('disabled', false)
      alert(data);
          });
  return false;
      e.preventDefault(); 
  });
});

当我将 Django 表单用作 {{ form.as_p }} 时,不会发生页面重新加载,但是当我使用“表单的自定义模板,其字段为带 ** 的密码字符字段且仅在单击编辑按钮后才可编辑”时, form.valid() 返回 false。

我要求 django 表单作为我想要的表单自定义模板。谁能指导我。

4

2 回答 2

1

我猜您没有覆盖前端的默认表单提交行为,并且您正在正常提交表单。

确保抑制表单提交的默认行为。 此页面在templates/contact/form.html 下提供了一个很好的示例

于 2012-05-16T12:59:22.660 回答
1

您可以在 JavaScript 中通过在提交表单时返回 false 来处理此问题。

form.submit(){
    #do something
    #make AJAX call
    #do something
    return false;
}
于 2012-05-16T14:23:39.590 回答