Discussion :

[soeursourire]

Bonjour,

Je cherche à cacher l'icône de loading qu'une fois que j'ai ajouté mes contenus. J'ai tenté d'utiliser la fonction end comme ceci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$(".articleList").append("<div class='list-content'>" + $(this).find(".list-content").html() + "</div>").end().parent().parent().find('.loading').css('display','none');

mais cela ne fonctionne pas et le loading ne disparait pas.

J'ai tenté

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$(".articleList").parent().parent().find('.loading').css('display','none');

depuis la console et cela le fait bien disparaitre donc le problème ne vient pas du degré de parent..

Comment résoudre ce problème? J'aurais voulu éviter de choisir un timeout et que cela disparaisse dès que les contenus sont affichés.
Merci
Sophie

[Toufik83]

Bonjour,

Quelle-est la structure html que tu utilises ?

[soeursourire]

Bonjour,

Je ne peux malheureusement pas vous donnez la page vu qu'il s'agit d'un site privé avec login. Je peux vous donner le bout de code qui contient ces articles si cela peut vous aider? ou est-ce que vous avez besoin d'autre chose?

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<div class="sf_colsOut sf_1col_1_100 articleList" data-placeholder-label="ARTICLE LIST" style="">
        <div id="Wrapper_TF8C13CD0007_Col00" class="sf_colsIn sf_1col_1in_100">
 
			<!-- LIST HTML -->
			<div id="Wrapper_TF8C13CD0003_wrapper_list_server" class="sf_colsIn">
 
				<div id="Wrapper_TF8C13CD0003_list_paging_server" class="list-paging">
					<div id="Wrapper_TF8C13CD0003_list_paging_left_top_server" class="list-paging-left">5 solution(s)</div>
				</div>
				<div class="list-content">
					<!-- 1st row -->
					<div class="content">
						<div class="sf_colsOut col-sm-6 content-left" data-placeholder-label="CONTENT LEFT">
						</div>
						<div class="sf_colsOut col-sm-6 content-right" data-placeholder-label="CONTENT RIGHT">
						</div>
					</div>
					<!-- 2nd row -->
					<div class="content">
						<div class="sf_colsOut col-sm-6 content-left" data-placeholder-label="CONTENT LEFT">
						</div>
						<div class="sf_colsOut col-sm-6 content-right" data-placeholder-label="CONTENT RIGHT">
						</div>
					</div>
				</div>
			</div>
 
        </div>
</div>

Merci

[Toufik83]

Bonjour,

Avec le code que tu as montré, le .loading n'existe pas, donc il est impossible de deviner son emplacement pour qu'ensuite le cibler...
Quel est l'emplacement de .loading ?

[Invité]

Bonjour,

• jQuery.when()

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$.when( ... ).then( ... );

[soeursourire]

Merci pour le conseil. Je ne suis pas sûre d'avoir bien compris le fonctionnement des when.then.

J'ai tenté ça

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
function appendContents(urlStr){
	$("<div>").load(urlStr + " .list-content", function() {
		$(".articleList").append("<div class='list-content'>" + $(this).find(".list-content").html() + "</div>");
	});
}
 
function loadNextPage() {
	if(nbPages >1) {
 
		$('.loading').css('display','block');
 
		var urlStr = myURL + "?pagenumber=" + p + "&category=" + categ + "&year=" + yr;
 
		$.when.appendContents(urlStr).then(function(){ 
			$('.loading').css('display','none');
		});
 
		p++;
 
	}
 
};

Mais j'ai cette erreur dans la console: $.when.appendContents is not a function