I have a drop down that I successfully have showing pladeholder text & the option from a field (Manufacturer) from my database (with all duplicates of that field removed.)
I have Dynamic Pages set up for each manufacturer that only shows the products from that manufacturer on their respective page.
However, when I select the Manufacturer from the drop down, I can not figure out the code to have it go to the corresponding Dynamic Page.
I assume it is by using location.to but I do not know what the reference should be. But I could be wrong there too.
help!
I thought this was going to be an easy answer.
Just need to know, how in the world you connect to a specific dynamic page url. Heck, I can’t even get a wix-location.to to even go to the 1st page of the Dynamic Pages much less go to the one I have specified in the drop down.
Here’s my code in case someone stumbles across this soon (iManufacturer is the dropdown ID, the Field Name I have set Dynamic Pages for is “Manufacturer” and the field key for that is “title”). No errors show up in the code, but when I select an item from the drop down it says " the item" is not a valid url.
import wixData from ‘wix-data’;
import wixLocation from ‘wix-location’;
$w.onReady(function () {
// Run a query that returns all the items in the collection
wixData.query(“PartsList”)
// Get the max possible results from the query
.limit(1000)
.ascending(“title”)
.find()
.then(results => {
// Call the function that creates a list of unique titles
const uniquetitles = getUniquetitles(results.items);
// Call the function that builds the options list from the unique titles
$w(“#iManufacturer”).options = buildOptions(uniquetitles);
});
$w(“#iManufacturer”).placeholder = “Products by Manufacturer”;
// 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.title);
// 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};
});
}
});
export function iManufacturer_change(event, $w) {
$w(“#dataset1”).setCurrentItemIndex(event.target.selectedIndex)
.then( () => {
wixLocation.to($w(“#dataset1”).getCurrentItem().title);
} );
}
Hi
In order to redirect to an internal page using location.to you need to specify the internal path (for example /myPage).
Since it’s a dynamic page your path will be /{you prefix for the pages}/{title for db}
In order to find your prefix you need to go to the setting of the dynamic page, you will see it there. If for example it’s my-pages then your code should be : wixLocation.to (“/my-pages/” + $w(" #dataset1 ").getCurrentItem().title);
Thanks Dalia!
After 4 days of reading, I finally got it figured out late Friday. I just haven’t had time to update my findings on here yet, so thank you!