nette.ajax.js, odeslání formulářů bez refreshe – FormSucceeded

Shoxy
Člen | 37
+
0
-

Dobrý den, používám nette.ajax.js a snažím se odeslat formulář bez toho aby se refreshnula stránka a po odeslání jsem se dostal do FormSucceeded metody, ale nedaří se mi a stránka se stále refreshuje. Prosím o radu!
Presenter:

<?php
      public function createComponentEditForm(){
        return new Multiplier(function ($itemId) {
        $aktivni = $this->cesty->PathActive($itemId)->fetch();
        $dodavatele = $this->dodavatel->byPathID($itemId)->fetchPairs('DodavateleID', 'DodavateleNazev');
        $aktivniDodavatele = $this->dodavatel->byPathIDActive($itemId)->fetchPairs();
        $form = new Form;
        $form->setMethod('POST');
        $form->getElementPrototype()->class = 'ajax';
        $form->addText('naves','Návěs pro cestu:')
             ->setDefaultValue($aktivni->CestyNaves)
             ->setHtmlAttribute('placeholder','Návěs');
        $form->addCheckbox('RouteActive', 'Aktvní cesta:');
        $form->setDefaults(['RouteActive'=>$aktivni->CestyAktivni]);
        $form->addCheckboxList('dodavatele', NULL,$dodavatele);
        $form->setDefaults(array('dodavatele' => $aktivniDodavatele ));
        $form->addHidden('CestaID', $itemId);
        $form->addHidden('newDod');
        $form->addSubmit('Zmenit','Uložit změny pro routu')
             ->getControlPrototype()
             ->addClass('ajax');
        $form->addProtection(); // Ochrana proti Cross-Site Request Forgery
            $form->onSuccess[]=[$this,'EditFormSucceeded'];
            return $form;
      });
    }

     public function editFormSucceeded($form,$values){
      $this->database->query('UPDATE Cesty SET CestyAktivni = ? WHERE CestyID = ?',$values->RouteActive,$values->CestaID);

     }
?>

Co jsem tak četl na fóru tak bylo razeno aby se input submitu ve formuláři přidala classka ajax nebo jí přídat přímo formuláři. Zkusil jsem obě varianty, ale ani jedna nepomohla.

Latte:

<div id="routeInfo">
   {foreach $cesty as $item}
   <div class="routewrapp hidden" id="Route-{$item->CestyID}">
      {form editForm-$item->CestyID}
      <div>{$item->CestyNazev}</div>
      <div>{label RouteActive:0}{input RouteActive:1} <br>
      <a class="my-link" onclick="return confirm('Opravdu chcete smazat cestu?')" n:href="deletePath! $item->CestyID">Smazat cestu</a>
      </div>
      <div>
      {label naves} {input naves}
      </div>
      <div>
     <div>
         <table rules="all">
            <tr>
               <td></td>
               <td>Název dodavatele</td>
               <td>Aktivní</td>
            </tr>
            {foreach $form[dodavatele]->items as $key => $label}
            <tr id="{$key},{$item->CestyID}">
               <td><a onclick="OdebratDodavatele({$key},{$item->CestyID},this);">Odebrat</a></td>
               <td>{$label}</td>
               <td><input n:name="dodavatele:$key"></td>
            </tr>
            {/foreach}
         </table>
     </div>
         {input Zmenit}
      </div>
      {/form}
   </div>
   {/foreach}
</div>

Formulář se odešle zavolá se FormSucceeded, ale stránka se refreshne..
Děkuji za všechny rady!

TheNEoo
Člen | 75
+
0
-
{snippet form}
    {control formular}
{/snippet}

a v presenteru pak po spracovani invalidovat co je potreba.

<?php
   public function editFormSucceeded($form,$values){
      $this->redrawControl('form');
     }
?>

Dokumentace

Editoval TheNEoo (12. 3. 2018 12:30)

Shoxy
Člen | 37
+
0
-

Takže nějak takto?:

<div id="routeInfo">
   {snippet formContainer}
      {foreach $cesty as $item}
      <div class="routewrapp hidden" id="Route-{$item->CestyID}">
      {snippet form-$item->CestyID}
         {form editForm-$item->CestyID}
         <div>{$item->CestyNazev}</div>
         <div>{label RouteActive:0}{input RouteActive:1} <br>
         <a class="my-link" onclick="return confirm('Opravdu chcete smazat cestu?')" n:href="deletePath! $item->CestyID">Smazat cestu</a>
         </div>
         <div>
         {label naves} {input naves}
         </div>
         <div>
        <div>
            <table rules="all">
               <tr>
                  <td></td>
                  <td>Název dodavatele</td>
                  <td>Aktivní</td>
               </tr>
               {foreach $form[dodavatele]->items as $key => $label}
               <tr id="{$key},{$item->CestyID}">
                  <td><a onclick="OdebratDodavatele({$key},{$item->CestyID},this);">Odebrat</a></td>
                  <td>{$label}</td>
                  <td><input n:name="dodavatele:$key"></td>
               </tr>
               {/foreach}
            </table>
        </div>
            {input Zmenit}
         </div>
         {/form}
         {/snippet}
      </div>
      {/foreach}
      {/snippet}
   </div>

Nyní však nevím jak tedy po odeslání samotného formuláře zavolat jeho formSucceeded metodu bez toho aby se refreshla stránka :/

Prezenter:

<?php
      public function createComponentEditForm(){
        return new Multiplier(function ($itemId) {
        $aktivni = $this->cesty->PathActive($itemId)->fetch();
        $dodavatele = $this->dodavatel->byPathID($itemId)->fetchPairs('DodavateleID', 'DodavateleNazev');
        $aktivniDodavatele = $this->dodavatel->byPathIDActive($itemId)->fetchPairs();
        $form = new Form;
        $form->setMethod('POST');
        $form->getElementPrototype()->class = 'ajax';
        $form->addText('naves','Návěs pro cestu:')
             ->setDefaultValue($aktivni->CestyNaves)
             ->setHtmlAttribute('placeholder','Návěs');
        $form->addCheckbox('RouteActive', 'Aktvní cesta:');
        $form->setDefaults(['RouteActive'=>$aktivni->CestyAktivni]);
        $form->addCheckboxList('dodavatele', NULL,$dodavatele);
        $form->setDefaults(array('dodavatele' => $aktivniDodavatele ));
        $form->addHidden('CestaID', $itemId);
        $form->addHidden('newDod');
        $form->addSubmit('Zmenit','Uložit změny pro routu')
             ->setHtmlAttribute('class','ajax');
        $form->addProtection(); // Ochrana proti Cross-Site Request Forgery
            $form->onSuccess[]=[$this,'EditFormSucceeded'];
            return $form;
      });
    }

     public function editFormSucceeded($form,$values){
      $this->database->query('UPDATE Cesty SET CestyAktivni = ? WHERE CestyID = ?',$values->RouteActive,$values->CestaID);
      $this->redrawControl('formContainer');

     }

?>

Editoval Shoxy (9. 3. 2018 22:51)

TheNEoo
Člen | 75
+
0
-

Udělal jsem si malej testik:

<?php

namespace App\Presenters;
use Nette\Application\UI\Form;
use Nette\Forms\Controls\SubmitButton;

class HomepagePresenter extends BasePresenter {

    public function createComponentMujForm() {
        $form = new Form;
        $form->getElementPrototype()->class = 'ajax';
        $form->addText('text', 'Text');
        $form->addSubmit('Odeslat')
                ->onClick[] = [$this, 'send'];
        return $form;
    }

    public function send(SubmitButton $button) {
        $values = $button->getForm()->getValues();
        if ($this->isAjax()) {
            $button->getForm()->setValues(['text' => NULL]);
            $this->flashMessage($values->text);
            $this->redrawControl('flashes');
            $this->redrawControl('form');
        } else {
            $this->redirect('this');
        }
    }

}
?>
{snippet form}
    {control mujForm}
{/snippet}

A jede bez problému :)

Editoval TheNEoo (10. 3. 2018 0:00)

Shoxy
Člen | 37
+
0
-

Tak jsem zjistil, že mi chyběli NetteForms takže jsem je stáhl „NetteForms“: https://nette.github.io/Forms.min.js ( Takže chyba z konzole je pryč.
Tak jsem zkopíroval tvůj formulář i s metodou send, přidal to samé do latte a stále se refreshuje.. Inicializované to mám snad dobře:
screenshot

<?php
if ($this->isAjax()) {
...
}
?>

Mi vrací False

Editoval Shoxy (10. 3. 2018 0:10)

TheNEoo
Člen | 75
+
+1
-

Funkcni demo:
Demo

Shoxy
Člen | 37
+
0
-

Děkuji!
Nakonec jsi mi pomohl.
Celý problém byl v tom, že to nešlo kvůli tomu, že

<?php
$(function () {
	$.nette.init();
});
?>

Nebylo v externím JS souboru, ale v pouze v tagu <script></script>
.. -_-
Ještě jednou díky! Tuhle prkotinu jsem hledal takovou dobu. :D