The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

How do You Save Data When Switching Pages?

2 posters

Go down

Solved How do You Save Data When Switching Pages?

Post by Draxion August 21st 2017, 9:59 pm

Technical Details


Forum version : #phpBB3
Position : Founder
Concerned browser(s) : Google Chrome
Screenshot of problem : https://i.gyazo.com/86ef89ce863bb6a0df5b63c5f788124d.gif
Who the problem concerns : All members
Forum link : ( link is hidden, you must reply to see )

Description of problem

This is more of a question or solution to my problem. I may know about coding but JavaScript and Jquery are where I am still learning more about and saving data on servers ain't one of them. As you can see in the screenshot, members can switch between CSS styles to make the forum a dark or light theme. I noticed when I changed it to the light theme, I had to do it again every time the pages reloads or switching between pages in the forum. Is there a way I can have it to where it saves the data they chose?

JavaScript:

Thanks for your help!


Last edited by Draxion on August 23rd 2017, 11:18 pm; edited 1 time in total
Draxion
Draxion
Helper
Helper

Male Posts : 2518
Reputation : 321
Language : English
Location : USA

https://www.talesoftellene.com/

Back to top Go down

Solved Re: How do You Save Data When Switching Pages?

Post by SLGray August 22nd 2017, 12:48 am

You need a line of code that saves cookies. Are you using the one by Ange Tuteur?


How do You Save Data When Switching Pages? Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51172
Reputation : 3507
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

Solved Re: How do You Save Data When Switching Pages?

Post by Draxion August 22nd 2017, 2:35 am

No, it's my own that I found online how to do and styled myself.

Yes, but I don't know how to code it to save cookies.
Draxion
Draxion
Helper
Helper

Male Posts : 2518
Reputation : 321
Language : English
Location : USA

https://www.talesoftellene.com/

Back to top Go down

Solved Re: How do You Save Data When Switching Pages?

Post by Draxion August 23rd 2017, 4:51 pm

bump
Draxion
Draxion
Helper
Helper

Male Posts : 2518
Reputation : 321
Language : English
Location : USA

https://www.talesoftellene.com/

Back to top Go down

Solved Re: How do You Save Data When Switching Pages?

Post by Draxion August 24th 2017, 5:37 pm

Bump
Draxion
Draxion
Helper
Helper

Male Posts : 2518
Reputation : 321
Language : English
Location : USA

https://www.talesoftellene.com/

Back to top Go down

Solved Re: How do You Save Data When Switching Pages?

Post by Guest August 24th 2017, 8:13 pm

Hello,

There are ways to do this on a fm forum:using localStorage or using cookies. I don't recommend you to use cookies since you are a beginner and localStorage is easier to use. The code would look like this:
Code:
$(function(){ /*Wait for the page to load*/
var light=0; /*By default we have the dark theme*/
if(localStorage.getItem("light")!=null){ /*If the localStorage item exists*/
$("body, #wrap").toggleClass("light-mode"); /* toggle the class(actually adding it since it doesn't exist at first*/
light=1; /*Remember we have the light theme*/
};
$("#myonoffswitch").click(function(){ /*When the user clicks on the element*/
if(light){ /*If the light theme is active*/
light=0; /*Remember we now have the dark theme*/
localStorage.removeItem("light"); /*Remove the localStorage item*/
} else { /*Otherwise, we have the dark theme*/
light=1; /*Remember we now have the light theme*/
localStorage.setItem("light", "light")
}
$("body, #wrap").toggleClass("light-mode"); /*Toggle the class*/
});
})

Note:I haven't tested the code. Also, the change event(second line in your code) can only be used on input elements. As you can see in my code I'm using the click event. It should work the same(theoretically better), but if the code is not working, change
Code:
click
to
Code:
change
in my code.
avatar
Guest
Guest


Back to top Go down

Solved Re: How do You Save Data When Switching Pages?

Post by Draxion August 24th 2017, 8:18 pm

Thank you so much, @Justice! That worked like a charm and I appreciate you explaining in every detail of how it works. Quick question though, is there a way to save the switch styles in the cookies too?

As you can see, the CSS styles were changed and saved as cookies, but the switch was reset back when I refreshed the page.
How do You Save Data When Switching Pages? 9b7d4171871a7a6247935c2226a719f5
Draxion
Draxion
Helper
Helper

Male Posts : 2518
Reputation : 321
Language : English
Location : USA

https://www.talesoftellene.com/

Back to top Go down

Solved Re: How do You Save Data When Switching Pages?

Post by Guest August 24th 2017, 8:25 pm

Yes it's possible. When you click on the button you add a class/id to it or how do you modify it's style?
avatar
Guest
Guest


Back to top Go down

Solved Re: How do You Save Data When Switching Pages?

Post by Draxion August 24th 2017, 8:28 pm

This is how the button is changed when clicked on.
Code:
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
  margin-left: 0;
  width: 215%;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
  right: 0px;
  background-color: #000;
}
Draxion
Draxion
Helper
Helper

Male Posts : 2518
Reputation : 321
Language : English
Location : USA

https://www.talesoftellene.com/

Back to top Go down

Solved Re: How do You Save Data When Switching Pages?

Post by Draxion August 24th 2017, 8:57 pm

Never mind, Thank you @Justice! I did it myself thanks to your directions.

Again, thank you!
Problem solved & topic archived.
Please read our forum rules: ESF General Rules
Draxion
Draxion
Helper
Helper

Male Posts : 2518
Reputation : 321
Language : English
Location : USA

https://www.talesoftellene.com/

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum