a drop down box to link to dynamic page

Ask the community
,
1

Hi,
I have a website about books. What I would like to do is to create a drop down list of authors saying " Browse by Authors". Once the author is selected, then when a button is clicked, it should lead to a dynamic page (already created) showing books related to that author.
What I did up till now is created the drop down box, connected it with the dataset of authors showing labels and values of authors names. but can’t seem to connect it with the dynamic page.
One more thing, books and authors are in two different datasets. The author’s names are referenced to books dataset.
I have tried to read through wix help but can’t get through it. please help!

2

Hello

here’s how u can do that

  • add a dropdown and connected to the authors field. - Here
  • add on item change event to the drop down. -Here
  • get the value selected in the event. -Here
  • link to the authors dynamic page using wix location based of the dynamic link . -Here

Best
Massa

3

Thanks alot @massasalah18 … But I don’t understand these codes here. I am a novice here. Can you or anyone else elaborate.

4

ok. I tried this… but wix location to() is not working. it always says that the page not found.
I used the following code.

import wixLocation from 'wix-location';

$w.onReady(() => {
$w("#dropdown1").onChange( (event, $w) => {
 let iauthor = event.target.value;
  wixLocation.to("/AUTHORS/iauthor");
}); 
});

Tried this code too…

export function dropdown1_change(event) {
    let iauthor = $w("#dropdown1").value;
    wixLocation.to("/AUTHORS/iauthor");
}

get the same result…
Can anyone help please?

5

Hello

That’s because your writing iauthor as a strring and not the value, try:

wixLocation.to(`/AUTHORS/${iauthor}`);

Best
Massa

6

Thanks a lot Massa.

It does work, but here comes another problem. The field used to create URL has spaces. In Wix URL the spaces are replaced by dashes ( - ). According to API reference the to( ) function attempts to properly encode the URL parameter that is passed to it. But the function here is only taking first part of the name before space, and dropping the rest without encoding the URL to include dashes. The result is " Page cannot be located".

The snapshots are attached.
Is there a way to encode the text to include dashes.

738×113 11.1 KB

795×351 26 KB

Thanks and Regards.

7

Hello

I would suggest two options:

  1. use regular expressions to make to string match the format (replace space with - )
  2. query the database based of the AUTHOR filed and get the link. then use wix location to the link itself

Best
Massa

8

Hi,

I tried to get the link from URL field of the dataset. But it shows error when i write the fieldkey of the url field which is (link-AUTHORS-author). Here is the snapshot.

The other fieldkeys are working but not the url one. :frowning:

9

Sam

It should work if you use this access method:

url = items[0]['link-AUTHORS-author'];
wixLocation.to(url); // You don't need to prefix the /AUTHORS because it is already part of the url you are loading :-)
10

Thanks alot @stcroppe . It worked.

Appreciate a lot.

Regards.