Hello all,
I have a database containing 5,000 items. The user enters a search term on the search page (input box) and a table with the results is displayed on the same page. The user can then click on the individual entries in the table to be taken to the full details on a dynamic page. A button on the dynamic page takes the user back to the search page, but the page is refreshed and their original search term is removed. Is there a way to remember their previous search term and automatically input it into the search input field? I think some form of wix-storage coding may be the answer but I’m not sure how to code for this.
My existing code is below. Any help would be very much appreciated.
Thanks so much,
Huw
import wixData from 'wix-data';
export function button1_click(event, $w) {
wixData.query('searchBOXdatabase')
.ascending("imprint")
.contains('imprint', $w('#input1').value)
.or(wixData.query('searchBOXdatabase').contains('publisher', $w('#input1').value))
.or(wixData.query('searchBOXdatabase').contains('type', $w('#input1').value))
.limit(1000)
.find()
.then(res => {
$w('#table1').rows = res.items;
$w('#table1').show();
});
}
$w.onReady(function () {
$w("#table1").columns = [{
"id": "col1",
"dataPath": "imprint",
"label": "Imprint/Platform",
"width": 400,
"visible": true,
"type": "string",
}, {
"id": "col2",
"dataPath": "publisher",
"label": "Publisher/Vendor",
"width": 400,
"visible": true,
"type": "string",
}, {
"id": "col3",
"dataPath": "countryOfOrigin",
"label": "Country",
"width": 176,
"visible": true,
"type": "string",
}, {
"id": "col4",
"dataPath": "type",
"label": "Category",
"width": 176,
"visible": true,
"type": "string",
}];
});
import wixLocation from 'wix-location';
export function table1_rowSelect(event, $w) {
let rowData = event.rowData;
let rowIndex = event.rowIndex;
const myRow = event.target.rows[rowIndex];
wixLocation.to(`${myRow["link-searchBOXdatabase-imprint"]}`)
}
$w.onReady(function () {
// Run a query that returns all the items in the collection
retrieveAllItems()
.then(results => {
// Call the function that creates a list of unique titles
const uniqueTitles = getUniqueTitles(results);
// Call the function that builds the options list from the unique titles
$w("#dropdown1").options = buildOptions(uniqueTitles);
});
// Builds an array from the "Title" field only from each item in
// the collection and then removes the duplicates
function getUniqueTitles(items) {
// Use the map method to create the titlesOnly object containing all the titles from the query results
const titlesOnly = items.map(item => item.type);
// Return an array with a list of unique titles
return [...new Set(titlesOnly)];
}
// Creates an array of objects in the form {label: "label", value: "value"} from the array of titles
function buildOptions(uniqueList) {
return uniqueList.map(curr => {
// Use the map method to build the options list in the format {label:uniqueTitle, value:uniqueTitle}
return {label:curr, value:curr};
});
}
});
async function retrieveAllItems(){
let results = await wixData.query("searchBOXdatabase")
.ascending("type")
.limit(1000)
.find();
let allItems = results.items;
while(results.hasNext()) {
results = await results.next();
allItems = allItems.concat(results.items);
}
return allItems;
}
export function dropdown1_change(event) {
wixData.query('searchBOXdatabase')
.ascending("imprint")
.contains('type', $w('#dropdown1').value)
.limit(1000)
.find()
.then(res => {
$w('#table1').rows = res.items;
$w('#table1').show();
});
}