Změna parametru v URL při ajax bez redirectu
- Croc
- Člen | 270
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.
- MajklNajt
- Člen | 498
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
- Člen | 270
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
- Člen | 498
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);
- Ondřej Kubíček
- Člen | 494
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