Nefunguje ajax snippet pro změnu obsahu

Upozornění: Tohle vlákno je hodně staré a informace nemusí být platné pro současné Nette.
Trsak
Člen | 22
+
0
-

Zdravím,
s ajaxem ve spolupráci nette nepracuji často a teď jsem narazil na problém a nevím, proč mi stále ajax nefunguje.

Handler:

public function handleRandomGenerate()
    {
        if ($this->isAjax()) {
            $elements = [0, 1, 2, 3, 4, 5, 6, 7, 8];
            $random = shuffle($elements);

            $this->template->elements = $random;
            $this->redrawControl('elements');
        }
    }

Šablona obsahuje:

{snippet elements}
                <table class="table table-bordered">
                    <tr>
                        <td>
                            {$elements[0]}
                        </td>
                        <td>
                            {$elements[1]}
                        </td>
                        <td>
                            {$elements[2]}
                        </td>
                    </tr>
                    <tr>
                        <td>
                            {$elements[3]}
                        </td>
                        <td>
                            {$elements[4]}
                        </td>
                        <td>
                            {$elements[5]}
                        </td>
                    </tr>
                    <tr>
                        <td>
                            {$elements[6]}
                        </td>
                        <td>
                            {$elements[7]}
                        </td>
                        <td>
                            {$elements[8]}
                        </td>
                    </tr>
                </table>
                {/snippet}
<a type="button" class="btn btn-danger" class="ajax" n:href="randomGenerate!" onclick="return false;"><i class="fa fa-random"></i> Náhodně vygenerovat</a>
<script src="{$basePath}/js/nette.ajax.js"></script>
    <script type="text/javascript">
        $(function () {
            $.nette.init();
        });
    </script>
Darkling
Člen | 35
+
0
-

Dej pryč onclick z toho odkazu.

Trsak
Člen | 22
+
0
-

Po kliknutí se teď stránka znovu načte, jako by to vůbec nebralo ten javascript

F.Vesely
Člen | 369
+
0
-

Console v prohlizeci ti nepise nic? Treba neco jako, ze ti chybi JQuery?

Trsak
Člen | 22
+
0
-

Nepíše právěže vůbec nic, už se vážně hodně zmaten.

F.Vesely
Člen | 369
+
0
-

Ukaz celej Presenter a jakou pouzivas akci + oprav si pouzivani funkce shuffle().

Trsak
Člen | 22
+
0
-
<?php
namespace App\Presenters;

use Nette;

class HomepagePresenter extends BasePresenter
{
    public function actionDefault()
    {
        $elements = [1, 2, 3, 4, 5, 6, 7, 8, 0];
        $this->template->elements = $elements;
    }

    public function handleRandomGenerate()
    {
        if ($this->isAjax()) {
            $elements = [0, 1, 2, 3, 4, 5, 6, 7, 8];
            shuffle($elements);

            $this->template->elements = $elements;
            $this->redrawControl('elements');
        }
    }
}
CZechBoY
Člen | 3608
+
0
-

Posle se pozadavej ajaxovej? Jaka je url, odpoved serveru?

Trsak
Člen | 22
+
0
-

Stránka se po kliknutí prostě přesměruje na ?do=randomGenerate, jako by tam ten js vůbec nebyl. Je tam ale načtený a v konzoli žádné chyby

CZechBoY
Člen | 3608
+
0
-

To jQuery mas prilinkovane? Driv nez nette.ajax.js?

Trsak
Člen | 22
+
0
-

Ano.

{block scripts}
	<script src="{$basePath}/js/jquery.min.js"></script>
    <script src="{$basePath}/js/nette.ajax.js"></script>
    <script type="text/javascript">
        $(function () {
            $.nette.init();
        });
    </script>
    <script src="{$basePath}/js/bootstrap.min.js"></script>
    <script src="{$basePath}/js/fuelux.min.js"></script>
	{/block}
GEpic
Člen | 566
+
+2
-

Trsak napsal(a):

Zdravím,
s ajaxem ve spolupráci nette nepracuji často a teď jsem narazil na problém a nevím, proč mi stále ajax nefunguje.

Handler:

public function handleRandomGenerate()
    {
        if ($this->isAjax()) {
            $elements = [0, 1, 2, 3, 4, 5, 6, 7, 8];
            $random = shuffle($elements);

            $this->template->elements = $random;
            $this->redrawControl('elements');
        }
    }

Šablona obsahuje:

{snippet elements}
                <table class="table table-bordered">
                    <tr>
                        <td>
                            {$elements[0]}
                        </td>
                        <td>
                            {$elements[1]}
                        </td>
                        <td>
                            {$elements[2]}
                        </td>
                    </tr>
                    <tr>
                        <td>
                            {$elements[3]}
                        </td>
                        <td>
                            {$elements[4]}
                        </td>
                        <td>
                            {$elements[5]}
                        </td>
                    </tr>
                    <tr>
                        <td>
                            {$elements[6]}
                        </td>
                        <td>
                            {$elements[7]}
                        </td>
                        <td>
                            {$elements[8]}
                        </td>
                    </tr>
                </table>
                {/snippet}
<a type="button" class="btn btn-danger" class="ajax" n:href="randomGenerate!" onclick="return false;"><i class="fa fa-random"></i> Náhodně vygenerovat</a>
<script src="{$basePath}/js/nette.ajax.js"></script>
    <script type="text/javascript">
        $(function () {
            $.nette.init();
        });
    </script>

Protože tam máš 2× class, navíc u anchoru se type nedefinuje. Tím, že přidáš třídu btn se ti automaticky z Bootstrap CSS tlačítko vytvoří, btn-danger poté upraví barvu.

<!-- This: -->
<a type="button" class="btn btn-danger" class="ajax" n:href="randomGenerate!" onclick="return false;"><i class="fa fa-random"></i> Náhodně vygenerovat</a>

<!-- Change to: -->
<a class="ajax btn btn-danger" n:href="randomGenerate!"><i class="fa fa-random"></i> Náhodně vygenerovat</a>

Editoval GEpic (19. 2. 2016 2:15)

Trsak
Člen | 22
+
+2
-

Díky! Koukal jsem do toho snad hodinu, ale 2× class jsem si nevšiml.