如何使用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>

來源

2014-09-12 Preston

如果你的Ajax代碼是在的fancybox內容，這是一個iframe，也許這可以工作：

success: function (data) { 
    if (data == "erro") { 
     alert("erro") 
    } else { 
     location.reload(); 
    } 
}

來源

2014-09-12 19:50:00 reyaner

damit ...我喜歡的類型是阿賈克斯，改爲iframe中，你的答案工作正常嘗試.. 。ty !!! – Preston 2014-09-12 19:53:34

也許我來不及加我的解決方案。但遲到會比從未更好，對吧？：P

我的情況是：我在我加載的ajax fancybox上有一個刷新按鈕，我想通過單擊此刷新按鈕來重新加載fancybox內容。的概念是點擊fancybox觸發器。

$('body').on('click','#refresh',function(){ 
    $('.fancybox').trigger('click'); 
});

希望它可以幫助

來源

2014-11-26 15:39:08 stephaniemartin

您可以在此，如果你不使用的iframe

jQuery.fancybox({'content' : html});

來源

2015-04-27 14:55:07

只是在現有的iframe中創建一個新的iframe。你需要做一些像$（'。fancybox-iframe'）。contents（）。find（'html'）。html（data）;但我無法讓它刷新框架 – CrabbyPete 2016-12-21 15:28:02

如何使用ajax提交內容在fancybox中加載內容提交

回答

相關問題