How do You Save Data When Switching Pages?
2 posters
Page 1 of 1
How do You Save Data When Switching Pages?
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:
- Code:
$(document).ready(function() {
$("#myonoffswitch").change(function() {
$("body").toggleClass("light-mode");
$("#wrap").toggleClass("light-mode");
});
});
Thanks for your help!
Last edited by Draxion on August 24th 2017, 01:18; edited 1 time in total
Re: How do You Save Data When Switching Pages?
You need a line of code that saves cookies. Are you using the one by Ange Tuteur?
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: How do You Save Data When Switching Pages?
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.
Yes, but I don't know how to code it to save cookies.
Re: How do You Save Data When Switching Pages?
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:
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
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
- Code:
change
Guest- Guest
Re: How do You Save Data When Switching Pages?
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.
As you can see, the CSS styles were changed and saved as cookies, but the switch was reset back when I refreshed the page.
Re: How do You Save Data When Switching Pages?
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?
Guest- Guest
Re: How do You Save Data When Switching Pages?
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;
}
Re: How do You Save Data When Switching Pages?
Never mind, Thank you @Justice! I did it myself thanks to your directions.
Again, thank you!
Again, thank you!
Problem solved & topic archived.
|
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum