1
Flaskではiframeにfancyboxのログインフォームが表示され、正常に動作しますが、エラーが発生した場合はフォームをリロードします。問題は、エラーが発生したフォームを送信すると、現在のiframe内に別のiframeが読み込まれることです。現在のiframeにフォームを読み込むにはどうすればよいですか？Flaskでエラーのあるfancybox 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)
は、ここで私はメインのアプリケーションを持っているjavascriptの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 %}
されています。それは
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() } });
、それは私が最終的にそれを考え出した実験をたくさんした後
<a class="fancybox_signin" id="sign-in" href="{{url_for('user.signin')}}">Sign In</a>
fancyboxコールがある場所にJavaScriptコードを投稿できますか？フォームに 'target =" _ self "'または 'target =" _ parent "'を試しましたか？ – Davebra
問題は、私が推測するあなたの成功関数に別のfancyboxを呼び出していることです。あなたはajax呼び出しの結果でfancyboxを開いていて、iframeタイプのfancyboxを開いています。 '$ .fancybox（data）;'の代わりに 'location.reload（）;'を使って成功関数内のiframeの内容を単純に更新できますか？ – Davebra
私はそれを試して、それはオリジナルをリロードしただけです。私もこの$（ 'body'、$（ 'fancybox-iframe'）をやってみました。それがボックス内のhtmlを変更するかどうかを確認するには、それはなかった – CrabbyPete