如何在 Flask 中重新加载有错误的 fancybox iframe 表单
Posted
技术标签:
【中文标题】如何在 Flask 中重新加载有错误的 fancybox iframe 表单【英文标题】：How do I reload fancybox iframe form with errors in Flask 【发布时间】：2017-04-28 18:12:37 【问题描述】：在 Flask 中有一个 iframe 显示一个带有 fancybox 的登录表单，它工作正常，但如果出现错误我想重新加载表单。问题是当我提交有错误的表单时，它会在当前 iframe 中加载另一个 iframe。如何在当前 iframe 中加载表单。
@user.route('/signin', methods=['GET', 'POST'])
def signin():
""" Login a user
"""
form = SigninForm(request.form)
if request.method == 'POST' and form.validate():
username = form.username.data
password = form.password.data
if username:
try:
user = User.objects.get( username = username )
except User.DoesNotExist:
form.username.errors = ['No such user or password']
context = 'form':form
return render_template('sign-in.html', **context )
else:
form.username.errors = ['Enter a Username or Email address']
context = 'form':form
return render_template('sign-in.html', **context )
if user.check_password(password):
login_user(user)
return render_template( 'close-iframe.html' )
else:
form.username.errors = ['No such user or password']
context = 'form':form
return render_template('sign-in.html', **context )
这是 Jinja2 模板
% extends 'base.html' %
% from "_formhelpers.html" import render_field %
% block body_block %
<body>
<div class="header">
<div class="wrapper">
<div id="sign-in-show"">
<div class="signin-form">
<div class="sign-up-in-tabcont" style="display: block;">
<form id="sign-in-form">
form.csrf_token
<div class="form-single-row">
render_field(form.username, id="email")
</div>
<div class="form-single-row">
render_field( form.password, id="password")
</div>
<div class="form-single-row">
render_field( form.submit, value='Login')
</div>
<div class="form-single-row">
<p class="forget-password">
<a href="url_for('user.forgot')">Forgot Password?</a>
</p>
</div>
</form>
<div class="clear"></div>
</div>
</div>
</div>
<div class="clear"></div>
<div class="header-outer"></div>
</div>
</div>
</body>
% endblock %
这是我在主应用程序中的 javascript。它可以工作，只是当它返回时我无法更改 iframe 中的 html
function send_ajax(e)
$.ajax( type : "POST",
cache : false,
url: "/signin",
data: $(this).serialize(),
success:function(data)
var box = $('.fancybox-iframe').contents().find('html');
box.html(data);
);
return false;
$("#sign-in-form").bind( "submit", send_ajax );
$('.fancybox').fancybox( onClose: function() window.location.reload() );
激活它的html是
<a class="fancybox_signin" id="sign-in" href="url_for('user.signin')">Sign In</a>
【问题讨论】：
你能把你的 JavaScript 代码贴在有 fancybox 调用的地方吗？您是否尝试过将target="_self" 或target="_parent" 用于表单？
问题是我猜你在你的成功函数上调用了另一个fancybox，并且你正在打开一个带有ajax调用结果的fancybox，并且你打开了一个iframe类型的fancybox。您可以尝试使用location.reload(); 而不是$.fancybox(data); 在成功函数中简单地更新iframe 的内容吗？
我试过了，它只重新加载了原件。我也试过这样做 $('body',$('.fancybox-iframe').contents()).html(data);看看它是否会改变盒子里的html，但它没有
我需要和你更详细的讨论。
【参考方案1】：
经过大量实验，我终于弄明白了。
function send_ajax(e)
$.ajax( type : "POST",
cache : false,
url: "/signin",
data: $(this).serialize(),
success:function(data)
parent.jQuery.fancybox(data);
);
return false;
$("#sign-in-form").on( "submit", send_ajax );
这只有一个问题。如果两次输入错误的密码，则不会出现第二个窗口。
【讨论】：
以上是关于如何在 Flask 中重新加载有错误的 fancybox iframe 表单的主要内容，如果未能解决你的问题，请参考以下文章
如何使用 Ctrl+C 结束 Flask SocketIO，错误 403（禁止）
Flask SocketIO 自动重新加载不起作用（在代码更改/开发中）
使用 Python 开发 Flask 应用程序时如何自动刷新浏览器？