Ako s najou zavolat handler signalu v komponente?

Creator13

V presentery mam .js subor a snazim sa nim zavolat handler signalu, ktory je v komponente.
Signal: handleStatusChange

Aku url adresu mam zadat, aby mi nehladalo handler v presenteri, ale hladalo ho v komponente?

	public function handleStatusChange(int $statusId): void
	{

	}

document.addEventListener('DOMContentLoaded', () => {
    const selectElement = document.getElementById('update-print-order-status');
    selectElement.addEventListener('change', (event) => {
        const statusId = event.target.value;

        naja.makeRequest('GET', '???', {statusId: statusId});
    });
});

m.brecher

@Creator13

Aku url adresu mam zadat, aby mi nehladalo handler v presenteri, ale hladalo ho v komponente?

Pokud komponentě odesíláš ajaxem parametry, musíš uvést globální název parametru, který obsahuje i jméno komponenty. Ten se ideálně získá pomocí $myComponent->getParameterId(‚name‘), příklad jsou v dokumentaci:

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

Do statického .js souboru latte nevykreslíš a tak je potřeba vložit kousek javascript kódu do šablony akce/komponenty, kde se jméno parametru definuje. Praktické může být i uložit si jméno parametru do html data atributu někde v šabloně komponenty a odsud si ho javascriptem přečíst.

Editoval m.brecher (2. 8. 16:31)

Creator13

Viem to zatial vyriesit bez signalu, ked si poslem poziadavok na url adresu, ktora mi to spracuje, ale pride mi to lepsie, ak by si to vedela vyriesit priamo komponenta. Ako to riesite v praxi? Cez signal komponenty?

Ako by zapis mohol vyzerat v mojom pripade? Som v tom zatial strateny. Riesim to prvy krat pri select boxoch.

Nazov komponenty: printOrderDetail

Latte: ako dostanem url do data-url?

<select id="update-print-order-status" class="form-select update-print-order-status" name="order-status" data-url="???">
    <option n:foreach="$printOrderStatuses as $printOrderStatus" value="{$printOrderStatus->getId()}" {if $printOrderStatus->getId() === $printOrder->getStatusId()}selected{/if}>{$printOrderStatus->getStatus()}</option>
</select>

Signal v komponente

public function handleStatusChange(int $statusId): void
	{

	}

.js: ako by vyzeralo finalne .js?

document.addEventListener('DOMContentLoaded', () => {
    const selectElement = document.getElementById('update-print-order-status');
    selectElement.addEventListener('change', (event) => {
        const statusId = event.target.value;
 		const url =	event.target.getAttribute('data-url');

        naja.makeRequest('GET', url, {statusId: statusId});
    });
});