nette ajax aborted u infinite scroll

marekd

Ahoj,

mám infinite scroll, který přes nette.ajax.js tahá další položky při scrollování. Nicméně z nějakého důvodu je 99% těhle ajaxových requestů aborted. Jednou za čas sem tam nějaký projde.

Když vypnu ten unique

$.nette.ext('unique', null);

globálně nebo u tohohle jednoho requestu, tak to funguje, ale tomuhle řešení se chci vyhnout.

Zkoušel jsem snad smazat i všechno z té stránky, další ajaxový request tam nemám, který by tomu vadil. Nějaké nápady?

jiri.pudil

Co znamená „při scrollování“? Nespustí se ti ta obsluha víckrát v jednu chvíli?

marekd

jiri.pudil napsal(a):

Co znamená „při scrollování“? Nespustí se ti ta obsluha víckrát v jednu chvíli?

Po tom co sescrolluješ dolů, níže uvedený kód jsem používal několikrát a tohle se mi stalo poprvé

			var page = JSON.parse({$page});
page++;

$(window).scroll(function () {
    if ($(window).scrollTop() + $(window).height() > $(document).height() - ($(window).scrollTop() + $(window).height()) / 5) {
        $.nette.ajax({
            type: 'get',
            url: {link moreDefault!},
            data: ({ offpage: page}),
            success: function (data) {
                page++;
            },
            error: function(jqXHR,status,error) {
                console.log(jqXHR);
                console.log(status);
                console.log(error);
            }
        });
    }
});

Jan Mikeš

Bindovat na scroll event je vetsinou docela overkill (provadeni stovek ajaxovych requestu behem jednoho scrollu ti muze server docela jednoduse i shodit), rad se podelim o sve reseni:

	var loadingFinished = true;

	$.nette.ext({
		complete: function(jqXHR, settings) {
			if (!loadingFinished) {
				loadingFinished = true;
			}
		}
	});

	if ($("a.load-more-posts.ajax").length) {
		window.setInterval(function() {
			var offset = 250;
			var $footer = $(".load-more-posts-placeholder");

		    var docViewBottom = $(window).scrollTop() + $(window).height();
		    var elemTop = $footer.offset().top;

		    if ((docViewBottom + offset) > elemTop && loadingFinished) {
		    	loadingFinished = false;
		    	$("a.load-more-posts.ajax").click();
		    }
		}, 500);
	}

V sablone mam jednoduse pomoci CSS schovane tlacitko <a class="load-more-posts ajax" href="loadMore!"></a>
Puvodne jsme meli „load more“ na klikani prave na toto tlacitko a prislo mi nejjednodussi nasledne simulovat kliknuti na toto schovane tlacitko, pro docileni efektu infinite scrollu.
Navic je to docela elegantni v tom, ze tlacitko se da pomoci css zobrazit pro mobilni zarizeni, kde infinite scroll zamerne vypinam.