How can i get the search bar working?

I want to use the search bar in my app. Do I only have to place it on the page? Or do I have to do some more things, and how?

You do need to wire up the logic manually. See the Movie Review app tutorial video on for this and much more, highly recommended viewing!

I’ve already watched it a few times. But the video uses an api and has data variables. And i only want to search on a page. Sry, but i don’t understand.

What sort of content is on your page? Repeated data or just static text?

It’s just static text i think. Some Image List Items which open another page on click. And I want to search between them.

Is it also possible to search in the complete App? So that also results from other pages are shown?
The results should also be the List Items wich opens another page on click.

The array should be an “app variable” for it to be accessible through every page. If you format your searchable array in a way that is similar to the data variable used in the tutorial you could try to follow it to the end and figure out your specific use case.

Hi, thank’s for your answer.
I’ve created an App Variable and put it as value to the search bar. But i don’t know what to do now.
I already watched the video a few times.

1 Like

Maybe reading this thread could help you.

:sweat_smile: i don’t understand…
i can’t get “currently repeated property value” as primary value. And i also can’t repeat with an page variable. Could you maybe say what i have to change so that it would work? And where i have to change it…

The things shown there, are not available. they are grey and not clickable.

Just to clarify, if your “data” is just a bunch of statically defined components/images on the page, then there’s currently no way to search across them – i.e. like pressing CTRL/CMD + F on a website.

For search to work, you need to have an array of objects as the source of your data. So instead of having several separate components, you’d have a single component that’s set to repeat from data like

[{id:0, name: "Atmung"}, {id:1, name: "Lunge & Brustkorb}]

and so on. Then, instead of typing the name as a static string, you bind it to, which causes the first repeated item to render name “Atmung”, second to render “Lunge & Brustkorb” and so forth.

Then for the search bar, you can use Sasu’s formula to make it so that only the items matching the search criteria are shown.

Thank’s. Where do i have to fill these things in?

[{id:0, name: “Atmung”}, {id:1, name: "Lunge & Brustkorb}]

do i have fill in things there?

Yeah, though if you change the binding type to formula you can use the JavaScript-like syntax (like I did above) which should be faster than constructing each item manually.

if i change the “Repeat with” part from Array to formula and then type this, it says there is a problem
2020-04-30 16.37.01 ea7d084cd5e6

I also tried to write this:
2020-05-01 12.36.42 a42b2c9eb20c

First i tried to change the primary variable to this formula. and then i tried to change “repeat this” to this formula. both shown with this failure.
what do i do false?

i have to change the primary label of every search result to a formula, right? or to “currently repeated property value”? but this is not clickable.
what do i have to write into it? if i only write things like or + [{id:0, name: “Atmung”}]

there are only failures.

And i then i also have to the “repeat with” part of every label to an array and this array to formula, right? and what do i have to write there. i have no idea.

and in search bar i also have to change the “Repeat with” part with array and then formula? and do i also have to change the value from string to something else?

and where do i have to set the App variable?

do i need the client-side-storage data resource?

In the first image you have invalid quote characters i.e. they’re not "or '. in the second one, I’m not sure thats what you want to do since you’re trying to concatenate a string from name to a string that is an array of object and it probably would not produce what you’re thinking of, also it’s missing the ending quotation mark to close the first one.

You need to have all the options you want to have available in your search component to be inside an array of objects - each object representing a thing that you want to search. Then you want to put that to a list component repeat value and continue from there.

It’s so hard to understand :disappointed_relieved:
there is nothing that i’ve understand…
i do not understand where i have to write which things…

i have my several list items and on top i have one list item to repeat the search results, right?
i have to change the “Repeat with” of this result List item to an array and then to formula, right?

in this formula i have to write this? but it does not work.

And i have to change the primary Label of this result list item to “currently repeated property value”? But i can’t choose it.

do i also have to change the “Repeat with” or the “Primary Label” of my several list item components, which are shown every time if there is no search?

And i have to change the visibility.
How can i bind things to

in the picture you’ve repeated with a page variable, but Harry says i have to repeat with array and formula and i also can’t choose a page variable there. it’s not clickable.

Maybe it’s a bit much what i want, but could you please say what i have to do. Maybe like a list or something else.
I think it would be much less text and much easier also for futere people who maybe have this question.

first you need an App Variable (or sth. else)
then you have to get one list item for the search results. in this item you have to change the repeat with part… (or sth. else)

it would be very great if that would be possible :smile:

You’re trying to repeat with an array of formulas and placing an array of objects inside the formula and then you get validation warning that Type "array is not assignable to “object” because array of arrays is not something you should repeat with.

Try changing the type of the repeat to just formula and place the formula you’ve written there. It should work.
Screenshot 2020-05-04 at 16.34.51

Yes, it works :+1:

but at this time i can’t search by name. All results are displayed and are visible full time. And they are also not clickable to open a page.
how can i fix this?
i already tried to write CONTAINS(LOWERCASE(, LOWERCASE(pageVars.searchTerm)) as formula at visibility. but i get an failure.
2020-05-04 16.03.05 72a96431e3b3

And is it also possible that the images of the search results are shown? At this time there is no image.