Jquery: Fadeout (), fadein () and Ajax call do not work in the right time

2

Hello. I have this code in JQuery:

$('#prods').fadeOut(300, function(event){
     chamaM(id_m);                            
});
$('#prods').fadeIn(300);    

ChamaM() is an AJAX function that makes a call to PHP code, displaying the contents within div #prods . Everything is working, but what is happening is that when the fadeout is complete the previous content is still there, so the fadeout() and fadein() happens in the current content and only then it loads the new content. In the test environment (XAMPP) everything works perfectly, but on the site server this error occurs. The address, for you to view is: www.lumiledbrasil.com.br/produtos.php

I have tried some variations of functions and order of them, but without success. Can someone help me? I thought this code was only needed. If you need more information, just let me know. Thank you so much!

    
asked by anonymous 21.08.2014 / 22:20

2 answers

1

Just to complement @helderburato's answer, to solve your footer problem, since your <div id="prod-container" ... has a minimum height of 350px, you can put a div to embrace the same with this minimum height ...

<div class="todooconteudo" style="min-height:350px">
     <div id="prod-container">
          // Seus produtos aqui
     </div>
</div>

This will keep the footer where it has to be because the div that encapsulates the contents of the dynamic div has a min-height, a css property.

Sucessooooooooo ....

    
21.08.2014 / 22:57
2

Try this way, I believe it will work, you give fadeOut () , remove the html from within the #prods tag, and when the result is call ajax, insert the result into the tag that is hidden and the fadeIn () to show it:

$('#prods').fadeOut(300, function(event){
    $(this).html("");
    chamaM(id_m);                            
});

function chamaM(id_chamado){
    $.ajax({
        type: 'POST',
        url: 'scriptPHP.php',
        data: 'id=' + id_chamado,
        success: function(data){
            if (data) {
                $('#prods').html(data).fadeIn(300);
            };
        }
    });
}
    
21.08.2014 / 22:40