nette.ajax.js – alt. obsluha pro AJAX s jQuery

a nevoláš tu změnu class a přidání targetu až po tom co se zaregistruje nette ajax, tudíž už je ten button nabindovany? Zkus tam třeba přidat .unbind(„click“)

Nakonec jsem to vyresil takto
Chci se zeptat Vojty Dobese jestli je to tak ok?

$.nette.ext('resolution', {
    load: function () {
        $('.dialogpopup').unbind("click").on('click', function (e){
            var $this = $(this);

            var w = $(window).width();
            var h = $(window).height();
            if(w<1000 || h<550){
                window.open($this.attr('href'), '_blank');
                return false;
            }else{
                $.nette.ajax({
                    url: $this.attr('href'),
                    type: 'POST'
                });
                return false;
            }
        });
    }
});

Diky Mira

Vojto to tvoje reseni mi nejak nechce fungovat, prosim, vcem je ten muj navrh spatne?

Bohuzel potrebuju resit ten resize to popup okno ma sirku 900px a tak tak se tam vejde vse co je treba tzn kdyz user otoci tablet na vysku tak bych chtel aby mu to automaticky otevrelo v novem tabu, nebo jako odkaz (neajaxove) to je asi jedno.

Editoval Kurtas (7. 3. 2013 15:29)

Vojto diky, uz mi funguje i ten tvuj kod mel jsi tam

if (this.isSmallResolution)
spravne ma byt isResolutionSmall, takove prepleky se blbe hledaji :)

Pouziji tve resene, diky moc

@vojtech.dobes
prosímtě můžeš poradit? zkouším použít přímo metodu nette.ajax následujícím způsobem:

$.nette.ajax({
	url: sSource,
	data: aoData,
	off: {
		unique: false
	}
}).done(function (data) {
	// ...
});

a problém je ten že pokud ty requesty se spustí za sebou tak se pozabíjejí a jede jen jeden :( Používám to pro načtení DataTables kdy se načítají dvě a více tabulek, jenže se mě načte jen ta poslední. Co dělám špatně?

nette.ajax.js jsem si pro jistotu sosnul teď z mastru a výsledek pořád stejný

Verze 1.2.2

Tag, Diff

• aktualizace na nové netteForms.js
• opraveny některé bugy (např.: history extenze v Chrome by neměla zobrazovat JSON odpověď)
• automatické volání load extenze vyčleněno z init
• přidána metoda $('.foo').netteAjaxOff() pro odstranění ajaxifikace z elementu
• automaticky je zajaxifikován i <button type=submit> element
• přidána rozšíření:
  • confirm.ajax.js pro [data-confirm]
  • ga.ajax.js pro Google Analytics
  • fidRemove.ajax.js pro automatické odstranění _fid parametru

Editoval vojtech.dobes (10. 3. 2013 16:08)

Určitě :). V tomto se skript drží originálního API z jQuery:

$.nette.ajax({
	...,
	beforeSend: function (xhr, settings) {
	}
});

Pokud ti nevadí, že onen callback proběhne těsně (milisekundy) po zahájení requestu (např. zobrazení spinneru je typický případ), můžeš místo toho použít klíč start:

$.nette.ajax({
	...,
	start: function (xhr, settings) {
	}
});

Ne :). Byla by to zbytečná režie pro něco, co je z povahy asi lepší řešit jinak než extenzi (proč by to jinak bylo primárně vypnuté).

Ukaž konkrétní kód, třeba mě přesvědčíš :).

tahle myšlenka je tady už delší dobu:

https://github.com/…js/issues/35

zatím to řeším validací elementu v before eventu…

Editoval pekelnik (11. 3. 2013 13:15)

@vojtech.dobes: ahoj, promiň že zase otravuju, ale právě zajaxovávm tu appku a co jde tak přehazuju na nette.ajax a narazil jsem na zvláštní problém. Když kliknu na link co má vypsat uložené články tak se tento link neuloží do historie a nezmění se url v adresním řádku. všechny ostatní linky zatím ok.

Všechny akce v tom presenteru končí stejné, invaliduje se snippet pro tělo té stránky, hlavička atd. Když se podívám na odpověď co vrátí server tak jak v případě kdy to neuloží tak i v případě kdy to uloží do historie je odpověď stejná (samo až na obsah invalidovaných snippetů)

Co je tedy rozdíl, tak to že je tam extension onsuccess která inituje na té stránce datatables plugin. Žeby se to nějak bilo s nette ajax?

A obecný dotaz, používá někdo z vás easyTabs pro jquery? (http://os.alfajango.com/easytabs) tenhle plugin mi totiž taky dělá ve spojení s nette.ajax bordel :(, a to konkrétně při kliku na záložku se spustí ajax request. Nemůže to spouštět to že při kliku na záložku se přidá do url hash s id té záložky?

Jde nějak zavolat konkrétní extension? Věc se má tak že pomocí nette.ajax načtu data, ale při tomhle requestu mám vypnuty skoro všechny extension. Získáná data se předají dataTables která je pak postupně nahází do tabulky a já potřebuju aby se po tom nahazení nějak spustil extension co mi aktivuje tooltipy. Když se ta extension spustí po zpracování requestu je to brzo, protože tabulka ještě není nalitá v DOMu. Jedním řešením je dát do té extension co registruje tooltipy malé zpoždění ale to mi nepříjde moc košér, další je že to prostě vyhodím z nette extensions a bude to mimo a v extension si to jen budu volat, ale to taky nechci, resp co jde tak dávám do těch extensions abych to měl hezky po ruce. Takže jde nějak externě spustit ta vybraná extensions, nějaký reinit?

Znamená „reinit zavěšení akce“ ajaxifikaci elementů? Lze to, stačí ručně zavolat $.nette.load();. Znovu to navěsí callbacky na všecky elementy se CSS třídou ajax.

Jenže $.nette.load(); provede init všech extension ne?

Ne :). Zavolá load všech extension. Máš pravdu, že to by mohly být komplikace.

Zajímalo by mě, proč se ti ajaxifikace někdy navěsí, a někdy ne… jinak řešil bych to opět stejně, vyčlenil bych obsah init extenze někam ven a ručně si ho zavolal.

Bude to asi tím, že po úspěšném doběhnutí požadavku se znovu zajaxifikují všechny elementy, ale ty DataTables jsou aktualizovány až poté.

Klidně jej zahoď (zdaleka to není jen nějaká bokovka, automaticky řeší spoustu příjemných maličkostí), já tento přístup rozhodně považuju za pěknou architekturu.

Ahojte, chcel by som vás poprosiť o radu pri riešení mojej situácie, ktorá je definovaná takto:

Mám hlavné menu s tlačtkami(class="ajax-flow) a po kliknutí na odkaz chcem zabaliť obsah stránky pod menu pomocou fadeOut, a po získani snippetov a aktualizácií DOM chcem zobraziť obsah pomocou fadeIn.

Teraz to mam spravené cez $.ajax a funguje. Ale akonahle zmenim na $.nette.ajax tak sa to javí akoby sa požiadavka vykonala dvakrát.

$(function () {
    $('.ajax-flow').on('click', function(e){
			e.preventDefault();
        var href = $(this).attr('href');
        var active = $(this).hasClass('active');
        if (active == true) {
            return false;
        }
        var old_pos = $("a.active").attr('data-position');
        var this_pos = $(this).attr('data-position');
        $("a.active").removeClass('active');
        $(this).addClass('active');
        var obr_width = 950;
        var kolko1 = (($(document).width() - obr_width)/2)+950;
        if (old_pos < this_pos) {
            var kam1 = '-'+kolko1;
            var kam2 = kolko1+'px';
        } else {
            var kam1 = kolko1
            var kam2 = '-'+kolko1+'px';
        }
        $.nette.ajax({
            type: 'GET',
            url: href,
            success: function(data){
                $('#snippet--body').slideUp('slow', function() {
                    $('#snippet--body_top').animate({
                        opacity: 0.0,
                    left: kam1
                    }, 750, function() {
                        $('#snippet--body_top').css('left', kam2);
                        for (var i in data.snippets){
                            var $el = $('#' + i.replace(/[\!"#\$%&'\(\)\*\+,\.\/:;<=>\?@\[\\\]\^`\{\|\}~]/g, '\\$&'));
                            $el.html(data.snippets[i]);
                        };
                        $('#snippet--body_top').animate({
                            opacity: 1.0,
                            left: '0'
                        }, 750, function() {
                            $('#snippet--body').slideDown('slow');
                        });
                    });
                });
            }
        });
        return false;
    })
});

Aké použitie eventov, by bolo v tomto prípade to správne?
A taktiež očakávam aby sa po ajaxovom „prepnutí“ stránky, zmenila aj URL v prehliadači.
Teraz sa to nemení aj keď mám .ajax alebo .nette.ajax.

Vďaka za radu.

Editoval yogiman321 (27. 3. 2013 10:10)

Báječný, u starýho jquery.nette.js jsem měl problém, že pokud se klikalo na ajax odkazy příliš rychle, některé se nezaznamenaly, přechodem na tuhle knihovnu vše automaticky začalo fungovat. Díky!

@motorcb, @JAM3SoN a @Gaprielko: vyzkoušejte novou podporu (na masteru).

$.nette.ext('snippets').complete(function () {
	alert('All snippets were updated!');
});

Pokud to nebude fungovat, můžeme ladit dál :).

@vojtech.dobes: vdaka, za tu predchadzajucu upravu, no narazil som este na jeden problem.. mam tabulku, v ktorej mam niekolko zaznamov a v kazdom riadku mam tl. pre odstranenie konkretneho zaznamu.. ak ajaxovo odstranim zaznam (handle motoda) a v aktualizovanom html kode dostanem vsetky polozky okrem vymazanej, tak sa nevykona complete event

$.nette.ext('snippets').complete(function () {
	// nevykona sa ..
}

sprava sa to rovnako s effektom pri update snippetu ako aj bez neho.. (zistil som to tak, ze mi nezmizne spinner)

Pokial vsak tym istym klikom len aktualizujem zaznam v tabulke a v aktualizovanom html vratim ci uz vsetky polozky alebo len aktualizovanu, tak to ide ok

Zdravim, muzete mi poradit, jak zajaxovat nove vytvorene elementy, ktere jsem ajaxove nahral do modalniho okna?

@vojtech.dobes
hele zkouším vypnout rozšíření přes data atribut a nějak se tomu nechce fachčit :(

<form id="frm-blockForm-1" method="post" action="--url--" data-ajax-off="snippets" class="ajax" novalidate="">
	... telo formu
</form>

cílem je že po zpracování formu aby to nereplacovalo snippety. Když to dám přímo do JS do volání tak to funguje ale tady v html ne :( nějaký bug? nebo dělám něco špatně?

edit:
asi teda moje chyba, to musí být na tom buttonu kterým se to vyvolává že ;)

Editoval akadlec (16. 4. 2013 19:24)

Ne, tu třídu ajax má jen ten element FORM, ale když sem si logoval co se děje při kliku na submit tak to ten data atribut bralo právě z toho buttonu.

nz, ale jako možná bych to tak nechal, aspoň se dají modifikovat jednotlivé buttony ;)

V situacích, kdy je potřeba spustit několik AJAX dotazů, lze ochranu proti více požadavkům vypnout následovně:

$.nette.ajax({
    url: ...,
    off: ['unique']
});

Požadavky běží a ve stejný čas kliknu na ajaxový odkaz, který mě zavede na jinou stránku. Za nějaký čas doběhnou i dříve spuštěné úlohy, které vrátí již zastaralé snippety. V některých situacích se může stát, že budu vrácen na původní stránku, záleží, jaké snippety se odešlou.

Bylo by dobré, kdyby existovala možnost, jak přerušit probíhající requesty, které nebyly rozšířením unique obslouženy. Ostatně i v komentáři se píše: abort last request if new started, tedy očekával bych, že se přeruší jakýkoliv předchozí request.

@vojtech.dobes: Chci mít možnost spustit několik požadavků paralelně (vypnu unique) a následně chci při kliknutí na odkaz předchozí paralelní požadavky zrušit.