où dois-je mettre la fonction jQuery .fade () dans le rappel de succès ajax?

J’ai un appel ajax qui remplit une partie de ma page avec le code HTML renvoyé dans le rappel de réussite:

function LoadCurrentCourses(masterKey, status) { status = 'S'; $.ajax({ type: "GET", url: "/Home/LoadCurrentCourses/?masterKey=" + masterKey + "&status=" + status, dataType: "html", success: function (evt) { $('#currentCourses').fadeIn(1500, function () { $('#currentCourses').html(evt) }); }, error: function (req, status, error) { $('#currentCourses').html("

Error occured resortingeving current courses

"); } });

}

le balisage #currentCourses a juste un en-tête et un fichier de chargement .gif dedans.

 

Current Courses

Le ajax est appelé depuis ma page principale sur doc.ready ():

   $(document).ready(function () { var masterKey = '@Model.MasterKey'; //load degree overview LoadCurrentCourses(masterKey); });  

Ce que j’essaie de faire, c’est que les données soient renvoyées. J’aimerais que le code HTML s’installe lentement dans la page principale, remplaçant ainsi le gif et l’en-tête. Pour le moment, tout fonctionne bien, tout est chargé et est remplacé, mais je n’arrive pas à comprendre où je devrais mettre la méthode jQuery .fadein ().

Des idées?

Vous devez charger le texte avant de passer en fondu

 success: function (evt) { $('#currentCourses').html(evt); $('#currentCourses').fadeIn(1500); }, 

Vous devrez peut-être également supprimer ou masquer ce conteneur avant de procéder à un fondu en fond d’écran, sinon il semblerait que rien ne se passe et que vous ne chargez que les nouvelles données.

Devrait être comme:

 success: function (evt) { $('#currentCourses').html( evt ).fadeIn(1500); } 

Fondu après que l’élément est .fadeIn() , sinon appeler .html() à l’intérieur du rappel .fadeIn() entraînera:

 fade--(fade ends)-->--(HTML applied)