Změna parametru v URL při ajax bez redirectu

Croc

Zdravím,
mám formulář, který se defaultně otevře v read modu (bez tlačítka uložit a všechny inputy disabled). Na stránce mám tlačítko na přepnutí read/edit módu, které volá handle ajaxově. V handle metodě překresluju dva snippety.
Všechno funguje jak má, jen bych potřeboval v URL také měnit parametr edit (1/0 říká zda je zapnutý edit/read mode), protože po přepnutí módu v URL zůstává původní hodnota. Takže když pak dám F5, stránka se refreshne ve stavu před klikem na změnu módu, což je nežádoucí.

$this->toolbar_buttons[] = Nette\Utils\Html::el('a')
                    ->setText($text_button)
                    ->href($this->link('changeMode!', ['edit' => $edit_new]))
                    ->setAttribute('class', $icon_button . ' btn btn-info ajax')
                    ->setAttribute('id', 'change-mode-edit-button');

public function handleChangeMode($edit) {
        $this->edit = $edit;
        $this->item->setEditMode($this->edit);
        $this->redrawControl('snippet1');
        $this->redrawControl('snippet2');
    }

Je nějaká jednoduchá cesta jak bez redirectu změnit parametr v URL?
Zkoušel jsem to pomocí nette.ajax. Ale tam mám zase problém, že překreslená stránka se vrací v payloadu a nepřekreslí se.

deleted

https://doc.nette.org/cs/http/urls

Možná by ti tohle mohlo pomoci.

MajklNajt

V tomto ti nette žiadnym spôsobom nepomôže, potrebuješ zmeniť URL v prehliadači, čo je úloha pre javascript, takže napr. prvý výsledok vyhľadávnia z google: https://stackoverflow.com/…ing-the-page

Croc

Díky za odpovědi. To je to o čem mluvím na konci v prvním příspěvku.

Zkoušel jsem následující:

<script>
        let button = document.getElementById('change-mode-edit-button');

        if (button !== undefined && button !== null) {

            button.onclick = function change() {
                let url_to_change = window.location.href;

                let edit = url_to_change.substring(url_to_change.indexOf('edit='));
                edit = edit.replace('edit=','');

                if (edit == 1 || edit == '1') {
                    edit = '0';
                } else {
                    edit = '1';
                }

                let url = new URL(url_to_change);
                let query_string = url.search;
                let search_params = new URLSearchParams(query_string);

                // new value of "id" is set to "101"
                search_params.set('edit', edit);

                // change the search property of the main url
                url.search = search_params.toString();

                // the new url string
                let new_url = url.toString();
                window.history.pushState("","", new_url);

                $.nette.ajax({
                    type: "GET",
                    url: {link changeMode!},
                    data: {
                     'edit': edit
                     },
                     success: function(payload) {

                     }
                });
            };
        }
    </script>

public function handleChangeMode($edit) {
        $this->edit = $edit;
        $this->item->setEditMode($this->edit);
        $this->redrawControl('snippet1');
        $this->redrawControl('snippet2');
    }

Problém je, že překreslená stránka se mi vrátí jako HTML ale v payloadu… Reálně se nepřekreslí

Editoval Croc (24. 8. 2018 8:34)

MajklNajt

na začiatku píšeš, že všetko funguje ako má (snippety sa ti prekreslujú), a potrebuješ k tomu doriešiť prepísanie URL v adresovom riadku prehliadača, na to predsa nepotrebuješ znova volať signál, jednoducho iba na tlačítko zavesíš JS callback window.history.pushState("", "New title", new_url);

Croc

Měl jsem za to, že event onclick a volání handlu nemůžou fungovat najednou. Proto jsem volal buď handle a nebo jen event onclick a v něm pak handle.

Díky moc, už to jede.

Editoval Croc (24. 8. 2018 9:01)

Ondřej Kubíček

pokud používáš nette.ajax.js, můžeš jednoduše přidat tuhle knihovnu https://componette.org/…tte.ajax.js/ která ti bude měnit url