# How do you create a dropdown list that allows users to download a selection of document files?

**URL:** <https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263>\
**Category:** Ask the community\
**Tags:** code, question\
**Created:** [February 3, 2021, 8:17pm UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263 "2021-02-03T20:17:02Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![barry96559](https://avatars.discourse-cdn.com/v4/letter/b/4af34b/32.png) [@barry96559](https://forum.wixstudio.com/u/barry96559)\
**Post date:** [February 3, 2021, 8:17pm UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/1 "2021-02-03T20:17:02Z")

</div>

I’d like to create a dropdown list entitled ‘Download PDF’. The dropdown will have 3 items. ‘PDF 1’, ‘PDF 2’ and ‘PDF 3’. When the user selects the item, the relevant PDF would then be downloaded. Any help with this much appreciated.

---

<div class="post-metadata">

**Author:** ![volkaertskristof](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/volkaertskristof/32/18158_2.png) [@volkaertskristof](https://forum.wixstudio.com/u/volkaertskristof)\
**Post date:** [February 3, 2021, 9:00pm UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/2 "2021-02-03T21:00:09Z")

</div>

Hi barry.

I took the liberty to make a tutorial for you.  
Take a look at my webpage.  
[[https://volkaertskristof.wixsite.com/helpcenter/downloadusingdropdown](https://volkaertskristof.wixsite.com/helpcenter/downloadusingdropdown)]([https://volkaertskristof.wixsite.com/helpcenter/downloadusingdropdown](https://volkaertskristof.wixsite.com/helpcenter/downloadusingdropdown)

Hope)

Hope this is what you are looking for.

Kind regards,  
Kristof.

---

<div class="post-metadata">

**Author:** ![barry96559](https://avatars.discourse-cdn.com/v4/letter/b/4af34b/32.png) [@barry96559](https://forum.wixstudio.com/u/barry96559)\
**Post date:** [February 3, 2021, 9:49pm UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/3 "2021-02-03T21:49:17Z")

</div>

Hi Kristof  
Thanks very much for your help! I’ve put in the example from your tutorial and it works great. However, I’ve created a dropdown with 3 items, and they all download the same PDF file.

To give you a bit more detail. I have a collection of songs (for guitar playing) set up and would like to give the users the opportunity to download the sheetmusic PDF for each song with either guitar track only or with guitar track and vocal track. Presumably these files need to be in different columns of each row?  
Kind regards  
Barry

---

<div class="post-metadata">

**Author:** ![nikita](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/nikita/32/32405_2.png) [@nikita](https://forum.wixstudio.com/u/nikita)\
**Post date:** [February 24, 2022, 7:35am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/4 "2022-02-24T07:35:08Z")

</div>

I’m struggling with this, the sample from Kristof fixed the dropdown so now users can select their language, but it’s not downloading the file once the language is selected and all the other conversations on this forum has outdated links to tutorials. Has anyone made a video that can explain this? One day when I figure this out I’ll make a friggen YouTube video and post it. I’m beyond frustrated.

 ![](https://us1.discourse-cdn.com/wix/original/3X/6/e/6ea0982d9998c7b0133176dbd74d636a5217ae3f.png)

---

<div class="post-metadata">

**Author:** ![volkaertskristof](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/volkaertskristof/32/18158_2.png) [@volkaertskristof](https://forum.wixstudio.com/u/volkaertskristof)\
**Post date:** [February 24, 2022, 7:52am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/5 "2022-02-24T07:52:53Z")

</div>

Hi Nikita,  
When selecting the dropdown item, does it download imidiatly or is there a button?

---

<div class="post-metadata">

**Author:** ![nikita](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/nikita/32/32405_2.png) [@nikita](https://forum.wixstudio.com/u/nikita)\
**Post date:** [February 24, 2022, 8:08am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/6 "2022-02-24T08:08:38Z")

</div>

Hi Kristof! I’m so happy you’re still active here. I would like for it to download immediately. I have not added a download button.

---

<div class="post-metadata">

**Author:** ![nikita](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/nikita/32/32405_2.png) [@nikita](https://forum.wixstudio.com/u/nikita)\
**Post date:** [February 24, 2022, 8:09am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/7 "2022-02-24T08:09:47Z")

</div>

This is the error that I’m getting.

 ![](https://us1.discourse-cdn.com/wix/original/3X/8/1/819a6d543b0a5327333a193013e271df66699332.png)

---

<div class="post-metadata">

**Author:** ![volkaertskristof](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/volkaertskristof/32/18158_2.png) [@volkaertskristof](https://forum.wixstudio.com/u/volkaertskristof)\
**Post date:** [February 24, 2022, 8:58am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/8 "2022-02-24T08:58:59Z")

</div>

@nikita  
When i see a reaction on one of my post’s i try to always answer them 🙂

I will take a look and see what is happening,

can you also post the code that you are using?

Kind regards,  
kristof.

---

<div class="post-metadata">

**Author:** ![volkaertskristof](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/volkaertskristof/32/18158_2.png) [@volkaertskristof](https://forum.wixstudio.com/u/volkaertskristof)\
**Post date:** [February 24, 2022, 9:07am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/9 "2022-02-24T09:07:33Z")

</div>

Seems like i had a small fault in my code wich didn’t change the currentItem from the dataset.

use thiscode for the onChange of the dropdown.

```javascript
$w("#dataset1").setCurrentItemIndex($w("#dropdown1").selectedIndex).then(()=>{
        wixLocation.to($w("#dataset1").getCurrentItem().link)
    })

```

Here is set the current index of the dataset to the selected index from the dropdown and after this is done you get the currentitem link

Kind regards,  
Kristof

---

<div class="post-metadata">

**Author:** ![nikita](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/nikita/32/32405_2.png) [@nikita](https://forum.wixstudio.com/u/nikita)\
**Post date:** [February 24, 2022, 9:17am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/10 "2022-02-24T09:17:11Z")

</div>

Hi Kristof, Thank you so much.  
This is the code that I’m currently using:

```javascript
import wixLocation from 'wix-location';
import wixData from 'wix-data';
let documents;

$w.onReady(function () {
//getting all documents from the collection
    wixData.query("documents")
        .find()
        .then((results) => {
        //setting the results to the variable declared above
            documents = results.items; //see item below
        })
        .catch((err) => {
 let errorMsg = err;
        });
});

export function dropdown1_change(event, $w) {
 let selectedOption = $w('#dropdown1').value;

 switch (selectedOption) {
 //these options are the values that were set to the dropdown
 case 'ENGLISH US':
        wixLocation.to(File[1].doc);
 break;
 case 'ENGLISH UK':
        wixLocation.to(File[2].doc);
 break;
 case 'Sample':
        wixLocation.to(File[3].doc);
 break;
    }
}

```

Do I add the string you mentioned like this under export function?

```javascript
import wixLocation from 'wix-location';
import wixData from 'wix-data';
let documents;

$w.onReady(function () {
//getting all documents from the collection
    wixData.query("documents")
        .find()
        .then((results) => {
        //setting the results to the variable declared above
            documents = results.items; //see item below
        })
        .catch((err) => {
 let errorMsg = err;
        });
});

export function dropdown1_change(event, $w) {
 let selectedOption = $w("#dataset1").setCurrentItemIndex($w("#dropdown1").selectedIndex).then(()=>{
        wixLocation.to($w("#dataset1").getCurrentItem().link)
    })

 switch (selectedOption) {
 //these options are the values that were set to the dropdown
 case 'ENGLISH US':
        wixLocation.to(File[1].doc);
 break;
 case 'ENGLISH UK':
        wixLocation.to(File[2].doc);
 break;
 case 'Sample':
        wixLocation.to(File[3].doc);
 break;
    }

```

---

<div class="post-metadata">

**Author:** ![nikita](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/nikita/32/32405_2.png) [@nikita](https://forum.wixstudio.com/u/nikita)\
**Post date:** [February 24, 2022, 9:22am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/11 "2022-02-24T09:22:25Z")

</div>

I missed a } at the end of the second snippet.  
I’m getting this error, I think that it wants to display text and not a download URL?

 ![](https://us1.discourse-cdn.com/wix/original/3X/4/0/402e619a2ed3fcbba9a24897d4793892da80bc1e.png)

---

<div class="post-metadata">

**Author:** ![volkaertskristof](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/volkaertskristof/32/18158_2.png) [@volkaertskristof](https://forum.wixstudio.com/u/volkaertskristof)\
**Post date:** [February 24, 2022, 9:24am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/12 "2022-02-24T09:24:27Z")

</div>

Can you show me the way your database is made? 🙂

---

<div class="post-metadata">

**Author:** ![volkaertskristof](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/volkaertskristof/32/18158_2.png) [@volkaertskristof](https://forum.wixstudio.com/u/volkaertskristof)\
**Post date:** [February 24, 2022, 9:27am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/13 "2022-02-24T09:27:23Z")

</div>

As you can see it says the document collection does not exist,  
Are you sure thats the name of your collection?

---

<div class="post-metadata">

**Author:** ![nikita](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/nikita/32/32405_2.png) [@nikita](https://forum.wixstudio.com/u/nikita)\
**Post date:** [February 24, 2022, 9:33am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/14 "2022-02-24T09:33:11Z")

</div>

![](https://us1.discourse-cdn.com/wix/original/3X/d/a/da9c18a96b48e90135f155a511ae261a14c75189.png)  
It does not give me the option to connect the Value to the File dataset - only Title (Text)

 ![](https://us1.discourse-cdn.com/wix/original/3X/7/5/75e7724995c7a7f2304cd7144dc6359ed0284723.png)

Like this

 ![](https://us1.discourse-cdn.com/wix/original/3X/1/a/1aa93f7dc0336d37c5ec1c8e9d2762b2ba74e30a.png)

---

<div class="post-metadata">

**Author:** ![volkaertskristof](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/volkaertskristof/32/18158_2.png) [@volkaertskristof](https://forum.wixstudio.com/u/volkaertskristof)\
**Post date:** [February 24, 2022, 9:40am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/15 "2022-02-24T09:40:07Z")

</div>

Try this.

```javascript

export function dropdown1_change(event,$w){
$w("#dataset1").setCurrentItemIndex($w("#dropdown1").selectedIndex)
.then(()=>{ 
wixLocation.to($w("#dataset1").getCurrentItem().doc)
})

```

And remove your query to the document database

```javascript
wixData.query("documents")
.find()
.then((results)=>{
//setting the results to the variable declared above
documents = results.items;
//see item below
})
.catch((err)=>{
leterrorMsg=err;
});

```

You don’t need this since documents doesn’t exist.  
This gives an error and the other code might fail.

Also you don’t need the swich function.

So the code should be like this:

```javascript
import wixLocation from 'wix-location';
import wixData from 'wix-data';
$w.onReady(function(){
})
export function dropdown1_change(event,$w){
$w("#dataset1").setCurrentItemIndex($w("#dropdown1").selectedIndex)
.then(()=>{
wixLocation.to($w("#dataset1").getCurrentItem().doc)
})

```

---

<div class="post-metadata">

**Author:** ![nikita](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/nikita/32/32405_2.png) [@nikita](https://forum.wixstudio.com/u/nikita)\
**Post date:** [February 24, 2022, 9:46am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/16 "2022-02-24T09:46:24Z")

</div>

Okay, so I cleared and updated as you said and I’m still getting this error 😕

Wix code SDK error: The url parameter that is passed to the to method cannot be set to the value . It must be of type string.

 ![](https://us1.discourse-cdn.com/wix/original/3X/3/d/3db5d8955d92af4b0800e0e02399d1cbb1fd14d0.png)

---

<div class="post-metadata">

**Author:** ![volkaertskristof](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/volkaertskristof/32/18158_2.png) [@volkaertskristof](https://forum.wixstudio.com/u/volkaertskristof)\
**Post date:** [February 24, 2022, 9:53am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/17 "2022-02-24T09:53:32Z")

</div>

Oow sorry use .file instead of .doc 😅

---

<div class="post-metadata">

**Author:** ![nikita](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/nikita/32/32405_2.png) [@nikita](https://forum.wixstudio.com/u/nikita)\
**Post date:** [February 24, 2022, 9:56am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/18 "2022-02-24T09:56:27Z")

</div>

@volkaertskristof you magnificent coder! It works! Gosh, I’ve been struggling with this for over a week!  
You have saved my sanity haha, thank you so much!

---

<div class="post-metadata">

**Author:** ![volkaertskristof](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/volkaertskristof/32/18158_2.png) [@volkaertskristof](https://forum.wixstudio.com/u/volkaertskristof)\
**Post date:** [February 24, 2022, 9:57am UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/19 "2022-02-24T09:57:40Z")

</div>

@nikita  
No problem, I’m happy i could help 🙂

---

<div class="post-metadata">

**Author:** ![nigelheidt97](https://avatars.discourse-cdn.com/v4/letter/n/73ab20/32.png) [@nigelheidt97](https://forum.wixstudio.com/u/nigelheidt97)\
**Post date:** [September 20, 2022, 3:15pm UTC](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263/20 "2022-09-20T15:15:57Z")

</div>

I have tried everything that this post says, it still doesnt work. I can get it so the dropdown menu shows the selection but when i press something nothing downloads. I also cant get the dropdown to link to documents only to title. Anybody who can help me?

[Next page](https://forum.wixstudio.com/t/how-do-you-create-a-dropdown-list-that-allows-users-to-download-a-selection-of-document-files/2263.md?page=2)