Naja, sortable, ajax snippety

d@rkWolf
Člen | 121
+
0
-

Zdravím, netušíte, co dělám špatně? @jiripudil ? Do handle se nedostanou data, co odesílám přes naja.makeRequest, není mi jasné proč. V proměnné „order“ je pole s upraveným pořadím od sortovače, ale v tom handle mám pole data furt prázdné, handle se spustí, protože ta flashMessage se zobrazí. Když se podívám v prohlížeči na provedený request, tak v něm to pole data s obsahem je. Zkoušel jsem i použít GET místo POST, ale nemá to na výsledek žádný vliv.

Udělal jsem to podle staršího ne-nette projektu, kde to mám řešené stejně, akorát si v jquery.load volám zvláštní soubor, kde je to zpracování a tam mi to funguje, data v requestu jsou úplně stejné…

Presenter – handle

public function handleSortImages(array $data)
{
    bdump($data);
    $this->flashMessage('Pořadí obrázků bylo aktualizováno!', 'alert-success');
    $this->redirect('this');
}

V šabloně

{snippet imagesList}
<ul class="gallery" id="sortable" data-link="{link sortImages!}">
    <li class="ImageHolder" n:foreach="$images as $oneImage" data-id="{$oneImage->id}">obrázek...</li>
</ul>
{/snippet}

samostatný JS soubor(není v šabloně)

naja.addEventListener('load', () => {
    let sortElem = $('#sortable');
    if (sortElem.length) {
        let postLink = sortElem.data('link');
        let list = Sortable.create(sortable, {
            animation: 100,
            onUpdate: function (evt) {
                let order = list.toArray(); // use instance
                naja.makeRequest('POST', postLink, {data: order});
            }
        });
    }
});
dakur
Člen | 67
+
0
-

@darkWolf Parametry action metody se berou z query stringu URL, kdežto ty posíláš data v těle požadavku. $this->getHttpRequest()->getRawBody() ti vrátí tělo, potom ho můžeš libovolně rozparsovat.

Editoval dakur (9. 9. 9:19)

d@rkWolf
Člen | 121
+
0
-

@dakur to by to ale mělo fungovat, když to pošlu GETem ne? a to taky nefungovalo, zkoušel sem obojí

jiri.pudil
Člen | 931
+
0
-

Jak ten request vypadá? Moje podezření je, že URLSearchParams, které Naja využívá k serializaci objektu s daty, si neporadí s polem a serializují ho v podobě, které neporozumí server.

Možná bych zkusil ten objekt sestavit ručně s pomocí []:

const data = new URLSearchParams();
for (const item of order) {
	data.append('data[]', item);
}

naja.makeRequest('POST', postLink, data);
d@rkWolf
Člen | 121
+
0
-

@jiripudil zkusil jsem to takto jak píšeš, furt mi to padá na:

Uncaught TypeError: ‘append’ called on an object that does not implement interface URLSearchParams.

Když to posílám POSTem:

XHR POST http://web-base-start.local/admin/gallery/edit/992?do=sortImages

[HTTP/1.1 200 OK 921ms]

[] […]
0 “3286”
1 “3285”
2 “3287”

1

%5B%5D=3286&%5B%5D=3285&%5B%5D=3287

Když to pošlu GETem:

XHR GET http://web-base-start.local/admin/gallery/edit/992?do=sortImages&data%5B%5D=3286&data%5B%5D=3285&data%5B%5D=3287

[HTTP/1.1 200 OK 720ms]

Ten admin je celej ajaxovej, snippety se překreslí, flash message co mám v té Handle se zobrazí, ale data tam žádný nejsou, furt je to prázdné, nevím, čím to, sem z toho zoufalý…hlavně, kdy mi to ve starém systému, kde sem to posílal takto:

$('.messages-block').load('./ajax/process_sortable.php', {gal_order: order, gal_id: gal_id});

Editoval d@rkWolf (15. 9. 14:56)

d@rkWolf
Člen | 121
+
0
-

Tak sem to zprovoznil, ač teda úplně netuším proč, nicméně takto to funguje:

let order = list.toArray();
naja.makeRequest('POST', postLink, {'galOrder': JSON.stringify(order)});

V handle pak použiju json_decode, asi je to něco s tím, že sem posílal to pole, ale moc jasný proč mi to teda není, když bez Nette mi stejný mechanismus s jQuery fungoval.

dakur
Člen | 67
+
0
-

@darkWolf Píšeš zkusil jsem to takto jak píšeš, furt mi to padá na... – ale jak jsi to zkusil? V původním příkladu používáš to, co vyplivne Sortable – jak jsi z toho potom udělal URLSearchParams? Možná tam bude chyba v té konverzi.

d@rkWolf
Člen | 121
+
0
-

@dakur mno však tak jak to píše Jiří Pudil, objekt new urlsearchparams a naládování těch položek z pole for cyklem-a výsledek byl ta chyba jak sem psal

ale teď mi to funguje, používám furt to pole ze Sortable, akorát na něj použiju JSON.stringify, to se do proměnné v handle předá správně, aj je jedno, jestli to pošlu POSTem, nebo GETem