# Using a List Viewer to Navigate

**URL:** <https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581>\
**Category:** Questions about Thunkable X\
**Tags:** list-viewer\
**Created:** [June 21, 2022, 1:03am UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581 "2022-06-21T01:03:30Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![mbritt](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/mbritt/32/43885_2.png) [@mbritt](https://community.thunkable.com/u/mbritt)\
**Post date:** [June 21, 2022, 1:03am UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581/1 "2022-06-21T01:03:30Z")

</div>

I want to do something that seems fairly simple but I can’t seem to figure it out. I put a list viewer on a page and I added items to it and now I just want to navigate to different pages in the app depending on which item in the list is clicked. I can’t seem to figure out how to attached a separate “navigate to” block onto each item in the list. Am I thinking about this right? Any help is much appreciated!

Michael

---

<div class="post-metadata">

**Author:** ![zander](https://avatars.discourse-cdn.com/v4/letter/z/ecb155/32.png) [@zander](https://community.thunkable.com/u/zander)\
**Post date:** [June 21, 2022, 2:06am UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581/2 "2022-06-21T02:06:58Z")

</div>

Is it a pre set list of pages? Or does it need to be dynamic? Are you using snap to place or drag and drop; A link to your project would also be helpful so we can see what you are doing and we dont be starting from scratch 😉

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [June 21, 2022, 3:15am UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581/3 "2022-06-21T03:15:54Z")

</div>

Make a local data source with a url in each row of the first column.

Then, in the When List Viewer Item is clicked block, navigate to Open link [Get Value for column 1, row id [index] ]. The index value is the number of the item that was clicked so you’re getting that row # which will contain the corresponding url.

---

<div class="post-metadata">

**Author:** ![zander](https://avatars.discourse-cdn.com/v4/letter/z/ecb155/32.png) [@zander](https://community.thunkable.com/u/zander)\
**Post date:** [June 21, 2022, 3:44am UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581/4 "2022-06-21T03:44:21Z")

</div>

Maybe I’m not getting it, how does the URLs help woth navigation?

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [June 21, 2022, 4:29am UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581/5 "2022-06-21T04:29:20Z")

</div>

**Edit:** I don’t know why I thought this topic was about urls… reading fail.

I made a mistake. The block would be the Open link block, not the Navigate block.

Here’s a demo: [Thunkable](https://x.thunkable.com/copy/3fff4cf55bde7fcbceaebcb8c4f242d0)

@mbritt See the first screen (with your username).

 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/7/4/74446a912bfa9d2440aa8f890873530b375fd7e0.png)

 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/6/3/63a5f55c85d4e8ed104682f14a475e27324dd1ab.png)

---

<div class="post-metadata">

**Author:** ![sketch](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/sketch/32/109058_2.png) [@sketch](https://community.thunkable.com/u/sketch)\
**Post date:** [June 21, 2022, 11:00am UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581/6 "2022-06-21T11:00:02Z")

</div>

@tatiang I don’t think that is what he means.

@mbritt you can use if statements to check whether the selected value is equals a value you want and then if it’s true you can navigate the user to the right screen.

---

<div class="post-metadata">

**Author:** ![mbritt](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/mbritt/32/43885_2.png) [@mbritt](https://community.thunkable.com/u/mbritt)\
**Post date:** [June 21, 2022, 12:45pm UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581/7 "2022-06-21T12:45:45Z")

</div>

Yes, I think @sketch is suggesting what is closest to what I’m looking for - a block that checks to see which item in the list has been clicked and which will take the user to the page (interior page - not a url) corresponding to that item. [Here is a link to the project](https://x.thunkable.com/copy/04408afa2b366a0ba17c5124800c98e9) (still in early stages of development) The app teaches students how to memorize various Psychology terms. From the homepage, click on “Test” and you’ll see the page with the list viewer. I want to send users to a different page depending on which item they clicked. Can you just give me a little more info on how to set up the if statements with the list?

Appreciate all the help!

Michael

---

<div class="post-metadata">

**Author:** ![sketch](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/sketch/32/109058_2.png) [@sketch](https://community.thunkable.com/u/sketch)\
**Post date:** [June 21, 2022, 3:11pm UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581/8 "2022-06-21T15:11:16Z")

</div>

Something like this will do the trick.

![Screenshot 2022-06-21 5.10.22 PM](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/e/d/ed316e2ddf4b9d781eb2dcf4ddf2183fcf286f85.png)

you can use the cogwheel to change its form.

---

<div class="post-metadata">

**Author:** ![mbritt](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/mbritt/32/43885_2.png) [@mbritt](https://community.thunkable.com/u/mbritt)\
**Post date:** [June 21, 2022, 3:34pm UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581/9 "2022-06-21T15:34:31Z")

</div>

Yup! That worked. Thanks so much. 😀

---

<div class="post-metadata">

**Author:** ![sketch](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/sketch/32/109058_2.png) [@sketch](https://community.thunkable.com/u/sketch)\
**Post date:** [June 21, 2022, 3:35pm UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581/10 "2022-06-21T15:35:04Z")

</div>

You’re welcome

---

<div class="post-metadata">

**Author:** ![muneer](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/muneer/32/75210_2.png) [@muneer](https://community.thunkable.com/u/muneer)\
**Post date:** [June 24, 2022, 8:54pm UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581/11 "2022-06-24T20:54:47Z")

</div>

This would be simpler  
 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/6/e/6eb4b7d94ea210e1e482c99778ab64f7ea05458d.png)

---

<div class="post-metadata">

**Author:** ![sketch](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/sketch/32/109058_2.png) [@sketch](https://community.thunkable.com/u/sketch)\
**Post date:** [June 25, 2022, 6:19am UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581/12 "2022-06-25T06:19:53Z")

</div>

Yeah,  
I know but if he wants to give the list items a different name than the screen,  
It wouldn’t work Wich is why I shared this approach.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/0/f/0f59f292712368bce16ff80133ae10de8a6f27e8.png) [@system](https://community.thunkable.com/u/system)\
**Post date:** [September 23, 2022, 6:20am UTC](https://community.thunkable.com/t/using-a-list-viewer-to-navigate/1933581/13 "2022-09-23T06:20:28Z")

</div>

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.
