NOVINKA - Online rekvalifikační kurz Python programátor. Oblíbená a studenty ověřená rekvalifikace - nyní i online.
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.

Diskuze: JS Tab při refresh stránky

V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.

Aktivity
Avatar
gorri
Člen
Avatar
gorri:6.5.2020 18:13

Zdravím zkušenější :-)
Chci se zeptat, jestli někdo neví jak efektivně vyřešit (bez nutnosti zásahu do URL) záložky na stránce, aby uživateli zůstala aktivní ta, kde byl naposledy i při refresh stránky.
Zobrazování mám vyřešeno takto

<script>
function basic() {
    document.getElementById("startb").style.background = "#0c70ae";
    document.getElementById("startb").style.color = "white";
    document.getElementById("formb").style.background = "#f0f0f0";
    document.getElementById("formb").style.color = "#b0b0b0";
}
function formss() {
    document.getElementById("formb").style.background = "#0c70ae";
    document.getElementById("startb").style.background = "#f0f0f0";
    document.getElementById("startb").style.color = "#b0b0b0";
    document.getElementById("formb").style.color = "white";
}
</script>

<div class="navas">
    <a onclick="basic()" id="startb" class="setbnt">Základní</a>
    <a onclick="formss()" id="formb" class="setbnt" style="background: #f0f0f0; color: #b0b0b0">Formulář</a>
</div>
<div id="start" class="settings">
    Obsah 1
</div>

<div id="form" class="settings">
    Obsah 2
</div>

Nicméně ve chvíli, kdy je uživatel na záložce Formulář, provede nějakou úpravu, která si vyžádá refresh stránky, tak po obnovení je opět na záložce základní. JS se pořád učím a tak bych požádal někoho zkušenějšího, kdo by mi s tímto dokázal pomoct. :-)
Moc děkuji za případnou pomoc. :-)

Zkusil jsem: stackoverflow a různé vlastní úpravy

Chci docílit: Po refresh stránky zůstat na aktuální záložce

Odpovědět
6.5.2020 18:13
Když vím, tak poradím. Nikdo neví všechno :-)
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:6.5.2020 19:39

js cookies, js localStorage, php session
https://developer.mozilla.org/…side_storage

Akceptované řešení
+20 Zkušeností
+2,50 Kč
Řešení problému
 
Nahoru Odpovědět
6.5.2020 19:39
Avatar
gorri
Člen
Avatar
Odpovídá na Peter Mlich
gorri:6.5.2020 19:59

Tak a jsem v řiti :D
Nevím co bych s tím měl dělat :D
Abych řekl pravdu, tak jsem čekal, že mi někdo napíše co tam případně dopsat. JS je pro mě zatím velká neznámá. Vím, že je to sobecké ale kdyby někdo měl třeba něco už takového vytvořeného, bylo by to super. Nechce se mi kopírovat někde něco z netu, kde bude hromada věcí ve kterých se nakonec ani nevyznám. :(
Ale moc děkuji za nasměrování. Zkusím se tím nějak prokousat. :-)

Nahoru Odpovědět
6.5.2020 19:59
Když vím, tak poradím. Nikdo neví všechno :-)
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:7.5.2020 6:05

Mno, to jsou moznosti, jakymi by to slo udelat. Prikladu je plny google.
A ne, budes muset cely kod prepsat.
Nebo, jeste je tu moznost pouzit frame layout. Menu bude v jinem frame nez obsah stranky. Kdo vi, jak se to zachova pri F5.
https://developer.mozilla.org/…lement/frame

<frameset cols="50%,50%">
  <frame src="menu.html" />
  <frame src="content.html" />
</frameset>

"Po refresh stránky zůstat na aktuální záložce"
Potrebujes tedy nekde ulozit, kterou stranku ma otevrenou. K tomu se pouziva session nebo cookies. Nove, misto cookies umi pracovat prohlizece s localStorage (s cookies se pracuje trochu krkolomne).
Nebo muzes uzivateli ulozit data i pres databazi nebo do souboru a nejakym zpusobem je propojit.
Asi nejcastejsim prikladem aplikace session + sql je nakupni kosik v eshopech. Nebo guestbook. Clanky a komentare, Mail. Zasilani zpravicek. Neco, co propoji username s necim ulozenym. A to mas asi 1.000 nejcastejsich pouziti, takze google bude opravdu hodne bohate na priklady.

 
Nahoru Odpovědět
7.5.2020 6:05
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:7.5.2020 11:37

Dal jsem ti link na localstorage. Jeste ti muzu dat ukazku pouziti cookies. Ale je to predelavka, tak nevim, zda cookies jsem uz rozchodil.
https://mlich.zam.slu.cz/js-ff/ff4b.htm

 
Nahoru Odpovědět
7.5.2020 11:37
Avatar
gorri
Člen
Avatar
gorri:8.5.2020 14:38

No z toho moc moudry taky nejsem. Nakonec to udelam tak, ze zatim bude mit tab vlastni url a prostuduji si nejake tutorialy k cookies v js.
Ale diky za info ;-)

Nahoru Odpovědět
8.5.2020 14:38
Když vím, tak poradím. Nikdo neví všechno :-)
Avatar
Unda
Člen
Avatar
Unda:8.5.2020 21:55

Moc nechapu co je na tom ke studovani. Nejjednodussi pro tebe z nabizenych moznosti je localStorage. Jen si pres

localStorage.setItem('nazevAtributu', hodnota)

uloz stranku. A pak pomoci

localStorage.getItem('nazevAtributu')

ji kdykoliv dostanes zpatky. ;)

 
Nahoru Odpovědět
8.5.2020 21:55
Avatar

Člen
Avatar
:9.5.2020 9:07

Chápem o čo ti ide, ale informáciu o aktuálne otvorenej záložke je zrovna vhodnejšie ukladať do URL. Pretože tak je možné uložiť si do obľúbených položiek stránku aj s informáciou o aktívnej záložke, alebo je možné nazdieľať link aj s informáciou o aktívnej záložke. Je to proste lepšie, ako uložiť to len do cookie, či localStorage.

 
Nahoru Odpovědět
9.5.2020 9:07
Avatar
gorri
Člen
Avatar
Odpovídá na
gorri:9.5.2020 10:37

Taky jsem nad tím přemýšlel. Nechám to v URL a bude pokoj.

Nahoru Odpovědět
9.5.2020 10:37
Když vím, tak poradím. Nikdo neví všechno :-)
Avatar
gorri
Člen
Avatar
Odpovídá na Unda
gorri:9.5.2020 10:38

Když něčemu nerozumím, tak je nutné abych si to prostudoval. Koneckonců to dělá každý. Nerozumí něčemu, tak se podívá a nastuduje si to pro další případnou práci ;-)
Na tom není nic k nepochopení. A jak jsem psal na začátku. V JS jsem nováček.

Nahoru Odpovědět
9.5.2020 10:38
Když vím, tak poradím. Nikdo neví všechno :-)
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:9.5.2020 21:02

Pouziti adresy by mohlo byt dali reseni, GET nebo hash

  1. Priklad maji na teto strance

https://www.jakpsatweb.cz/…ascript.html
Kliknes na odkaz pridat, tam maji v adrese ?jidlo=ryby&pi­ti=caj

  1. Nebo muzes cist location.hash, odkaz s #ryby

https://www.jakpsatweb.cz/…-window.html#…

Editováno 9.5.2020 21:02
 
Nahoru Odpovědět
9.5.2020 21:02
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 11 zpráv z 11.