Как обновить содержимое, загруженное внутри fancybox с помощью ajax submit

Question

У меня есть какая-то форма, которую я загружаю внутри 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> 

Answer 1

Если ваш код Аякса в содержании FancyBox, который является IFrame, может быть, это может работать:

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

Answer 2

может быть, я слишком поздно, чтобы добавить мое решение. но лучше поздно, чем никогда, не так ли? : P

мое дело: у меня есть кнопка обновления на моем загруженном ajax fancybox, и я хочу перезагрузить fancybox контент, нажав эту кнопку обновления. Концепция заключается в нажатии триггера fancybox.

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

Надеется, что это помогает

Answer 3

Вы можете попробовать это, если вы не используете IFRAME

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