I am trying to make a small website with search filters (textbox and checkboxes). I have searched around and seen that the way to remember the past search filters ONLY AFTER refresh is using session storage.
However, the problem is that, even when the user browses around the website and comes back to the search page, he/she would still see the past search filters. I want to reset the search filters when the user is coming from a different page.
I'm thinking and searching around as to how to remove these variables stored in the session storage after the user leaves the page and only keeping it when the user refreshes.
My current code goes like this :
var selectedCompanies = new Array;
var selectedCategories = new Array;
var searchWord = "";
if(sessionStorage.getItem('selectedCompanies') != null){
selectedCompanies = JSON.parse(sessionStorage.getItem('selectedCompanies'));
alert("NOT NULL!");
//loop to recheck checkboxes
}
if(sessionStorage.getItem('selectedCategories') != null){
selectedCategories = JSON.parse(sessionStorage.getItem('selectedCategories'));
//loop to recheck checkboxes
}
if(sessionStorage.getItem('searchWord') != null){
searchWord = sessionStorage.getItem('searchWord');
$('#filter-searchbar').val(searchWord);
}
Please help as to how can I delete the variables inside the session storage after the user leaves the search page. Thanks!
Add the following code in a common JavaScript file. Reference this file on all pages except the search page:
sessionStorage.removeItem('selectedCompanies');
sessionStorage.removeItem('selectedCategories');
sessionStorage.removeItem('searchWord');
This will clear the search parameters on all other pages but allow the data to persist on the search page.
Related
I'm trying to make a page on my tumblr that has a button on it, which counts how many times it's been pressed. I've gotten it to work, but a browser close or refresh clears the value, and clicks from different people don't stack. Here's what I have:
<body>
<div class="main">
<h3>Click Counter</h3>
<button id="clickme">Click me: 0</button>
<h5>Filler Text</h5>
</div>
<script>
var button = document.getElementById("clickme"),
count = 0;
button.onclick = function() {
count += 1;
button.innerHTML = "Click me: " + count;
};
</script>
</body>
This makes the button count up when pressed, but I want it to behave like so:
User #1 clicks twice. Counter reads two.
User #2 visits the page, counter is already at two, user clicks 3 times. Counter is at 5.
User #3 visits, counter is still at 5 for them as well, etc.
As of right now, each user visits the page and the value starts at zero. Help?
Depending on your needs, you could use localStorage.
count = localStorage.getItem('count');
count = parseInt(count); // because localstorage stores everything in strings
// First time the value does not exist...
if(count == null) {
count = 0;
}
button.onclick = function() {
count += 1;
button.innerHTML = "Click me: " + count;
localStorage.setItem("count", count);
};
This is not a server side solution. It's also less reliable as it can be cleared by the user anytime.
javascript runs on the browser and store all the variable in the browser so the scope of a variable is in the browser. you can use local storage but if all user uses the same browser which is not your need so only way to persist data is to save count (data) into the server and fetch count (data) on a load of the page.
you can use firebase real-time database if you don't have any server.
Getting started with Firebase real-time database for the web
As I have understant form your question you want to retain the user click count, there is 3 scenerio
User visits form Single machine Single browser (rare situation)
in this you can use local storage
User visits form Single machine multiple browser
In this case you have to save it in server side
User visits form multiple machine multiple browser
In this case you have to save it in server side
Both case 2,3 are same , you need to save it in server.
A common way to do this , put you counter in db and an REST end point and call that endpoint on page each page load to take the counter form the server and also after clicking update on the server by similar end point
Suggesting learning: Client side : AJAX (Jquery) , Server side : REST API , DB (MySql,ets)
I am developing a web app for work that adds an editor to a spreadsheet and then removes that editor when his/her step is complete.
I am running into an issue where I can't remove the editor via the User object. The User object returned by .getActiveUser() isn't found in the User[] array returned by .getEditors().
Example:
var editors = SpreadsheetApp.getActive().getEditors() //returns User[]
var user = Session.getActiveUser(); //returns User
return editors.indexOf(user) // returns -1
This happens even though the active user is an editor of the spreadsheet in question.
I can get around this issue by removing the user via email address (i.e. removeEditor(email)), but this seems like an extra step.
Does anyone know why these two User objects wouldn't be the same? Is this a bug?
How to store multiple document.referer value in sessionStorage?
For example:
you visit www.stackoverflow.com
-> current sessionStorage (value) is www.stackoverflow.com using JS document.referer
-> then you click one of the link on stackoverflow.com, example you click stackoverflow questions
page www.stackoverflow.com/questions. your current sessionStorage is now www.stackoverflow.com/questions
-> and then you click one of the individual questions link www.stackoverflow.com/questions/howtofixthis/
How do we store the previous document.referer values in sessionStorage which is accessable in the fourth page
example in stackoverflow.com/questions/howtofixthis/ you click one users with link www.stackoverflow.com/user/iamcoder
in current page the previous the sessionStorage values should be accessable, the values are:
1st origin value = www.stackoverflow.com
2nd www.stackoverflow.com/questions
3rd www.stackoverflow.com/questions.com/howtofixthis/
4th www.stackoverflow.com/user/iamcoder
The purpose of using sessionStorage is to store visited pages url in current session and accessible through multiple external pages.
So far this I came up this code but doesn't store previous links at origin.
<script>
var s_origin = document.referrer;
var on_session = sessionStorage.setItem('origin', s_origin)
var data = sessionStorage.getItem('origin');
console.log('session origin ' + data)
</script>
You need to read the current value in session storage and append the new one.
function appendReferrer(value){
if(value){
var referrers = JSON.parse(sessionStorage.getItem('origin') || null) || [];
referrers.push(value);
sessionStorage.setItem('origin',JSON.stringify(referrers));
}
}
function getReferrers(){
return JSON.parse(sessionStorage.getItem('origin')) || [];
}
Usage:
//Append a new Item
appendReferrer("stackoverflow.com");
//Read all referrers
var referrers = getReferrers();
console.log(referrers);
I'm using Parse to handle my backend and I'm encountering issues grabbing data from my Parse objects. I've seen many questions similar to this, but none with a straightforward answer.
My User objects have a field called groupsArray which is an array that contains Group objects. Each Group object then contains a field called groupName, which is simply the name of that particular group object.
Here is my trouble. I'm grabbing the current user via
var user = Parse.User.current();
then I grab the groupsArray and the groupNames via
var groupsArray = user.get("groupsArray");
var groupName = groupsArray[i].get("groupName");
Initially this works after I add a group, however, my problem comes after I refresh my browser. After refreshing my browser, all my groupName fields are undefined. When I try and grab their id, it works, but all the personal fields that I created for that object is undefined. When I go to my applications dashboard on parse.com, I see all the objects with their groupNames. Anyone know what's going on?
More detailed code:
Inside groups.js, which calls modelGroups.js:
$('#tester').on('click', function() {
populateSidebar();
});
Inside modelGroups.js:
function populateSidebar(){
var groupsArray = Parse.User.current().get("groupsArray");
for (var i=0; i<groupsArray.length; i++) {
var groupName = groupsArray[i].get("groupName");
console.log(groupName); // ALL of these are undefined after a browser refresh
}
}
And yes, even after refreshing the browser, Parse.User.current() is fetching the correct user, user.id, and username
It seems that the group data needs to be fetched from database again after refresh to me. Never happened on iOS since I enabled local datastore for me.
I am making a website that has a shopping basket feature and I am using the session to store the shopping cart. When I navigate through the site it works fine and displays the number of items in the basket, but when I click on a link that is create by a javascript function it loses the variable on the session. It only causes this problem on the links generated by javascript
Adding item code
if (context.Session["jobBasket"] == null)
{
context.Session.Add("jobBasket", new System.Collections.ArrayList());
}
var list = context.Session["jobBasket"] as System.Collections.ArrayList;
var item = int.Parse(context.Request["jobId"]);
if (!list.Contains(item))
{
list.Add(item);
}
Are sessions even enabled for your app? for instance - if you have a single page that reads, updates, and prints out the value - does it stay? if not your session is potentially disabled or configured odd, check your web.config