如何使用ajax提交内容在fancybox中加载内容提交
我有一些我在Fancybox内加载的表单。当我提交这个Ajax,并且我获得成功时,我想重新加载这个Fancybox窗口中的同一页面,但我不知道如何。如何使用ajax提交内容在fancybox中加载内容提交
我已经试过$.fancybox.update()
但没有工作。我正在使用Fancybox 2.
任何人都可以帮忙吗?
这里是我的代码:
父页面上:
<script type="text/javascript" charset="utf-8">
$("a.open-modal").fancybox({type: 'ajax'});
</script>
<a class="open-modal" href="edita_cadastro_imagens.asp?codProd=<%= rs_Pesq("codProd")%>&codCor=<%= rs_Pesq("codCor")%><%=str_pesq%>&ref=<%= rs_Pesq("referencia")%>"><i class="fa fa-camera fa-lg"></i></a>
这里是页面的代码:edita_cadastro_imagens.asp
我的Ajax代码:
<script type="text/javascript">
$(document).on('submit', '#f1', function(event) {
event.preventDefault();
var formData = new FormData($(this)[0]);
console.log(formData);
$.ajax({
url: "upload_produtos.asp?cod_prod=<%=codProd%>&cod_cor=<%=codCor%>&Num_Img=1",
type: "POST",
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function(data){
if (data == "erro") {
alert("erro")
} else {
//$.fancybox.close();
$.fancybox.update();
}
}
});
});
</script>
和我形式:
<form name="f1" id="f1" action="" method="post" enctype="multipart/form-data">
<div class="div_coluna col_image">
<% if objFSO.FileExists(Server.MapPath("../produtos/mini") & "/"& codProd&"_"&codCor&" (1).jpg") then %>
<img src="../produtos/mini/<%= codProd%>_<%= codCor%> (1).jpg" border="0"/>
<% else %>
<img src= "imagens/imgNDisp.png" border="0" height="49px" width="70px"/>
<% end if %>
</div>
<div class="div_coluna col_field">
<input type="file" name="txtArquivo1" accept="image/jpg" class="small_form_control" style="width:90%">
</div>
<div class="div_coluna col_bt">
<button class="button">ENVIAR</button>
</div>
<div class="clear"></div>
</form>
如果你的Ajax代码是在的fancybox内容,这是一个iframe,也许这可以工作:
success: function (data) {
if (data == "erro") {
alert("erro")
} else {
location.reload();
}
}
也许我来不及加我的解决方案。但迟到会比从未更好,对吧? :P
我的情况是:我在我加载的ajax fancybox上有一个刷新按钮,我想通过单击此刷新按钮来重新加载fancybox内容。 的概念是点击fancybox触发器。
$('body').on('click','#refresh',function(){
$('.fancybox').trigger('click');
});
希望它可以帮助
您可以在此,如果你不使用的iframe
jQuery.fancybox({'content' : html});
只是在现有的iframe中创建一个新的iframe。你需要做一些像$('。fancybox-iframe')。contents()。find('html')。html(data);但我无法让它刷新框架 – CrabbyPete 2016-12-21 15:28:02
damit ...我喜欢的类型是阿贾克斯,改为iframe中,你的答案工作正常尝试.. 。ty !!! – Preston 2014-09-12 19:53:34