Hi all - long time lurker, but first time posting as I have finally run into a function that is getting complex. How do I ask this question?
I have a page that displays a collection containing a repeater (/archives). I can filter this repeater by the type of object(s) displayed (and my URL remains the same - previously I created multiple pages for this as a workaround). Because of the multiple page creations, I was able to link directly from my home page to these pre-filtered repeaters (/archives/library for example). However, I know wish to use a similar button or onClick function on the HOME page to bring the user to the collections page and have it ALREADY filtered based on the button chosen on the home page.
See attached: image showing my Archives page with “Library” filter selected. Is it possible to code my home page so that when choosing the “Library” button from the menu here, the user is taken to the /archives page with the filter operation already complete? I’m happy to link direct my website and supply code, but it’s very lengthy.
Thanks for the help,
Robert
You can make use of the Wix Storage API to save the users choice on one page and then recall that on another page and set the elements on the page to those saved values when the page loads.
https://www.wix.com/corvid/reference/wix-storage.html
How do I pass data between pages in my site?
Use the wix-storage API. Use the setItem() function to place data in storage on the originating page. Then use the getItem() function to retrieve the data on the target page.
Or you can use url parameters to do this which is mentioned in a post in the related posts box on this forum post.
https://www.wix.com/corvid/forum/community-discussion/user-input-to-filter-a-collection-on-other-page
Thank you, this almost works for me but I can’t seem to reset. Any one of the multiple items I have set into storage gets stuck there and on returning to the HOME page and choosing another selection, the ARCHIVES page does not change. I am trying to work with .clear(); codes but nothing seems to work. Say we are looking at albums. That section of code on HOME reads:
//ARCHIVE REDIRECTS
import {session} from “wix-storage” ;
import wixLocation from ‘wix-location’ ;
session.clear();
//to ALBUMS
export function button52_onClick(event, $w) {
session.setItem( ‘Albums’ )
wixLocation.to( “/Archives” );
}
export function button60_onClick(event, $w) {
session.setItem( ‘Albums’ )
wixLocation.to( “/Archives” );
}
and on the second page I have:
//Album from HOME
$w.onReady ( function () {
session.getItem( ‘Albums’ )
toggleFold( 1 )
buttonON( 3 )
return wixData.query( ‘Archives’ )
.eq( ‘type’ , ‘album’ )
.find()
.then(results => {
originalPropertiesInfo = results.items;
$w( ‘#repeater1’ ).data = originalPropertiesInfo;});
});
Since these samples are repeated for each choice (rosters, yearbooks, albums etc) how can I reset when opening the home page or clicking the link from the home page?
Thanks so much for the help, I was able to very quickly get a singular instance to work with the storage function.
Robert
You have the two options for clearing anything from storage, you can use either clear or remove.
https://www.wix.com/corvid/reference/wix-storage.Storage.html#clear
https://www.wix.com/corvid/reference/wix-storage.Storage.html#removeItem
Add it to the pages onReady function for the page that you want to delete storage items on.
Remove all items from session storage
import {session} from 'wix-storage';
// ...
session.clear();
Remove an item from session storage
import {session} from 'wix-storage';
// ...
session.removeItem("key");
So something like this…
import {session} from 'wix-storage';
$w.onReady(function () {
session.clear();
});
import {session} from 'wix-storage';
$w.onReady(function () {
session.removeItem("key");
});
Otherwise you can have a simple reset button and do it like you have above within the buttons onClick event itself.
Thank you, I think the code you provided to clear the storage will work. I used a work around on the second page where I used IF get.item (unique button) then display that in the repeater, ELSE display all, but it was a bit glitchy as I think becuase I wasn’t clearing storage anywhere the pages would hang on to the previous selection at times.
I just added the CLEAR to my home page and I think it’s working smoothly and I can probably delete the IF and ELSE code on the secondary page.
Thanks for the help GOS, this is something I have been trying to acheive for awhile.
Robert
I’m sorry I did not see this until now! I’ve actually run into an issue on this which I will post separately. For now, this was the final code that worked.
This is the code on my HOME page for TWO paths/buttons only. I have two locations (a menu and images) to navigate from.
import { memory } from "wix-storage";
import wixLocation from 'wix-location';
$w.onReady(function () {
memory.clear();
});
//to ALBUMS
export function button52_onClick(event, $w) {
memory.setItem('Albums')
wixLocation.to("/Archives");
}
export function button60_onClick(event, $w) {
memory.setItem('Albums')
wixLocation.to("/Archives");
}
//to BOOKS
export function button51_onClick(event, $w) {
memory.setItem('Books')
wixLocation.to("/Archives");
}
export function button61_onClick(event, $w) {
memory.setItem('Books')
wixLocation.to("/Archives");
}
Now the receiving cove on the /ARCHIVES page, again only showing the matching two from above though there are several in all. This also includes portions of code that rerence a container and buttons on this page that I wanted to have shown selected.
if (memory.getItem('Albums')) {
toggleFold(1)
buttonON(7)
$w('#pagination1').hide();
return wixData.query('Archives')
.eq('type', 'album')
.find()
.then(results => {
originalPropertiesInfo = results.items;
$w('#repeater1').data = originalPropertiesInfo;
});
}
if (memory.getItem('Books')) {
toggleFold(1)
buttonON(8)
$w('#pagination1').hide();
return wixData.query('Archives')
.eq('type', 'book')
.find()
.then(results => {
originalPropertiesInfo = results.items;
$w('#repeater1').data = originalPropertiesInfo;
});
}
else {
wixData.query('Archives')
.isNotEmpty('type')
.find()
.then(results => {
originalPropertiesInfo = results.items;
$w('#repeater1').data = originalPropertiesInfo;
})
}
});
Since I have adopted new URL parameters on my search pages, I have modified how this function works. it is much simpler now. On the HOME page, here is an example of a button press. now instead of storing local information, it just takes you to the URL for the item of interest. In this case, albums.
import wixLocation from 'wix-location';
//to ALBUMS
export function button52_onClick(event, $w) {
wixLocation.to("/Archives?type=album");
On the following page, I have the following (I’ve omitted a significant amount of button/fold hiding and showing to give only the necessary code):
import wixData from 'wix-data';
import wixLocation from 'wix-location';
let query = wixLocation.query;
//Load Type from Query / Homepage
$w.onReady(function () {
if (query.search !== undefined) {
$w("#search").value = query.search
executeSearch()
}
if (query.type === 'album') {
toggleFold(1)
buttonON(3)
return wixData.query('Archives')
.eq('type', 'album')
.find()
.then(results => {
$w('#repeater1').data = results.items;
let count = results.items.length
if (results.items.length > 0) {
$w('#results').expand();
$w('#results').text = "COLLECTION OBJECTS: " + count.toString();
}
});
}
if (query.search == undefined) {
$w("#search").value = ""
$w("#dynamicDataset").setSort(
wixData.sort()
.descending("_createdDate"))
$w('#pagination1').show();
}
});
