ajax odkazy v šabloně – načtení stránky bez refreshe

phoniq

používám nette.ajax.js
Jak zajistit načtení stránky bez nutnosti refresh?

<ul class="nav justify-content-center">
    <li class="nav-item">
        <a class="nav-link ajax" n:href="Presenter1:">Presenter1</a>
    </li>
    <li class="nav-item">
        <a class="nav-link" n:href="Presenter2:">Presenter2</a>
    </li>
    <li class="nav-item">
        <a class="nav-link ajax" n:href="Presenter3:">Presenter3</a>
    </li>
</ul>

chemix

https://doc.nette.org/…ication/ajax

phoniq

Děkuji za odpověď. Dokumentaci jsem samozřejmě četl, ale nepochopil jsem zda musím pokaždé udělat handler a v něm to přesměrovat na jiný presenter a nebo to jde nějak jednodušeji.

V případě, že budu mít odkazů třeba 20, budu muset mít i 20 handlerů?

chemix napsal(a):

https://doc.nette.org/…ication/ajax

chemix

Ahoj, poprosim te tedy o pomoc se zlepsenim dokumentace, aby to bylo pripadne jasne dalsim lidem, kteri k tomu prijdou prvne.

Na ajaxove pozadavky ma Nette Fw. super nastroj v podobe snippetu. Snippetem oznacis kus kodu co ma byt dynamicky nahrazovan pri ajaxovem pozadavku. V jednoduchem priklade si udelame tedy navigaci a obsah.

<ul class=navigation>
  <li><a n:href="Homepage:">Home</a></li> {* zde muzu zkratit Homepage:default na Homepage: *}
  <li><a n:href="About:">About</a></li>
  <li><a n:href="Page:a">Page A</a></li>
  <li><a n:href="Page:b">Page B</a></li>
</ul>

{snippet content} {* nazev snipetu *}
  {include content} {* nazev includovaneho blocku ze sablon *}
{/snippet}

takhle stranka bude fungovat spravne i bez ajaxu. Přidame jeste nejake invalidovani snippetu. To znamena: Pokud je pozadavek ajaxovej ($this->isAjax()) tak nebudeme posilat celou stranku ale posleme jen jeji fragment co se zmenil … a fragment co se zmenil oznacime volanim metody $this->redrawControl('content'); kde content je nazev snippetu co se ma prekreslit. Timto oznacenim fragmentu k prekresleni se uz nebude posilat html odpoved klientovi ale pripravi se JSON s blokem snippets, ktery bude obsahovat vsechny snippety, ktere se maji prekreslit.

Metodu handle neni treba pro kazdy ajaxovy pozadavek vytvaret. Asi doporucim vice si precist sekci zivotni cyklus presenteru https://doc.nette.org/…n/presenters#… ale chapu ze pro zacatecnika to je celkem orisek pochopit, take jsem nevedel presne co jak volat nez jsem si s tim zacal poradne hrat a zkouset. Co naplat. V tuhle chvili ti jen poradim, ze pokud mam takovouhle jednodussi verzi stranek, tak staci ve zpracovani zjistit zda se jedna o ajax a v tomto pripade posleme jen info o prekresleni fragmentu stranky – snippetu.

class HomepagePresenter {

  function renderDefault(){
    $this->template->variable = 100; // nejprve poslo do sablony vse potrebne

    // a pak se rozhodnu zda jen invalidujem snippety nebo budem pokracovat v dalsim klasickem zpracovani
    if ($this->isAjax()){
      $this->redrawControl('content');
    }
  }

}

Pak uz je dulezite jen pridat class ajax pro odkazy a nalinkovam nette.ajax.js nebo pouzit Nittro knihovnu, se kterou posledni dobou pracuji radeji a zde https://github.com/nittro/demo najdes nekolika krokove demo, co te provede jeste lepsim „zajaxovanim“ aplikace.