Search button

Hi there 

I'm trying to create a search button that when clicked will be able to search the records within my database for the record name that has been inputted by the user.

How would I do this? 

Kind Regards

Hi Shaan,

A good way to get a code example that's suitable for your data model would be to rely on OutSystems scaffolding.

Take your Entity, and drag it to the flow where you want your screen to appear:

Once you let go, a List Screen for that Entity will be generated. You'll see a list of the data inside that Entity, as well as a search field and a button:

Let us know if you have more questions.

Hi Shaan,

This type of thing is very basic and covored very well in the beginner training.  Please have a look at guided path for web or mobile developer.

You will find this lesson


Dorine

Dorine Boudry wrote:

Hi Shaan,

This type of thing is very basic and covored very well in the beginner training.  Please have a look at guided path for web or mobile developer.

You will find this lesson


Dorine

I'm building a mobile app does this apply to mobile apps? 

This lesson wasn't covered in the mobile developer course that I completed.


Kind Regards


Hello Shaan.

That is one of the first things explained in the courses. Take a look there. It will make your learning process easier.


Not knowing hat you alreadyhave, it is hard to explain. Here goes the common steps:


Easy way

Just drag the entity and to a flow and Service Studio will generate the code for you. You can then adapt.


Manually

Create a variable to save the input string.

Adapt your query to filter by such value (probably you will need to use LIKE)

Record.Name like "%" + SearchKeyword + "%"

The search button must call an action that will refresh the query and then refresh the screen. (on reactive forget the refresh screen part).


Afonso Carvalho wrote:

Hi Shaan,

A good way to get a code example that's suitable for your data model would be to rely on OutSystems scaffolding.

Take your Entity, and drag it to the flow where you want your screen to appear:

Once you let go, a List Screen for that Entity will be generated. You'll see a list of the data inside that Entity, as well as a search field and a button:

Let us know if you have more questions.

Hi Afonso 

I believe I've already done this(pic below).

I can already display the records on screen.


What I am trying to do now is add a search bar where I can search for whatever record I want to see.

How would I do this?

Kind Regards


You drag an Input field to the screen and associate its OnChange to an Action that refreshes query.

You can drag a text Input to your screen from the widget list to the left:

It will start without a variable, so you can create a local one in your screen by clicking on the Variable dropdown:

Then you'll need to adapt your query to make use of the value of this Variable in order to filter it. Take a look at what Nuno Reis posted regarding the LIKE operator. You'll need to add this to your Aggregate Filters.

Since you're using server data that needs to be fetched every time you start a new search, you should not use the OnChange property of the input - this can cause unnecessary server calls. You should create a button and the user should have to click it to be able to search. You can add a button and create an Action that refreshes your Aggregate:

Since you're on mobile, you don't have to worry about refreshing the screen.

Nuno Reis wrote:

You drag an Input field to the screen and associate its OnChange to an Action that refreshes query.

input field from where?


Afonso Carvalho wrote:

You can drag a text Input to your screen from the widget list to the left:

It will start without a variable, so you can create a local one in your screen by clicking on the Variable dropdown:

Then you'll need to adapt your query to make use of the value of this Variable in order to filter it. Take a look at what Nuno Reis posted regarding the LIKE operator. You'll need to add this to your Aggregate Filters.

Since you're using server data that needs to be fetched every time you start a new search, you should not use the OnChange property of the input - this can cause unnecessary server calls. You should create a button and the user should have to click it to be able to search. You can add a button and create an Action that refreshes your Aggregate:

Since you're on mobile, you don't have to worry about refreshing the screen.

as you can see in attached photo I have opened a client action called SearchOnClick what do I need to put in here?


Drag the Refresh Data element:

And a window will appear where you'll be shown a list of Aggregates on that screen. Select the aggregate that returns your data, and you should be good to go.

Afonso Carvalho wrote:

Drag the Refresh Data element:

And a window will appear where you'll be shown a list of Aggregates on that screen. Select the aggregate that returns your data, and you should be good to go.


I added this like you said(pic below) but when I tested my app it lets me type but when I click the search button it doesn't work.

Did you add a LIKE filter from the example Nuno Reis posted? Can you share your OML file?

Afonso Carvalho wrote:

Did you add a LIKE filter from the example Nuno Reis posted? Can you share your OML file?

Not sure where to put it & here's my OML


Solution

I can't publish it because of missing references but from the looks of it all you're missing is the Aggregate filter. Double click your Aggregate and add this to be able to filter by location:

Solution

Afonso Carvalho wrote:

I can't publish it because of missing references but from the looks of it all you're missing is the Aggregate filter. Double click your Aggregate and add this to be able to filter by location:

Thank you Afonso