Unanswered

Using Enter to Search with input

(0) Share

Report

Posted on by Po5

Hi All,

I've recently created a PowerApp which will allow a User to input a number and selecting the search button will cause a Collection to be filtered and shown below.

The App would mainly be used in browser.

This all works fine, however I am not sure how to configure it so the search button can be selected when a User hits enter (as most users would when using a search bar.

I know in most cases you could just add the filter logic on-change of the text field but I am looking for options that are different from that.

Ideally the User would enter a number, hit the Enter button and the Collection would show a list of items filtered by that input.

Cheers

Categories:

Building Power Apps

I have the same question (0)

All responses (10)

Answers (0)

Sort by

Community Power Pla... Microsoft Employee on at

Like (0)

Report
Copy link

Link copied!
@Po5

The OnChange event of your Text input is the best option here, just add this to that property

Select(searchButtonName)

Was this reply helpful? Yes No
Po5 17 on at

Like (0)

Report
Copy link

Link copied!

Hi,

Thanks for that.
It does provide a better option than just clicking Search every time but is still not exactly what I'm looking for.
For example, using this if I click away or press tab it will filter, which somewhat makes the search button redundant.
In this case however I want the User to have to hit enter after typing or select the search button to filter, which is behaviour I would expect from a normal search bar with a search button.

Cheers

Was this reply helpful? Yes No
Community Power Pla... Microsoft Employee on at

Like (0)

Report
Copy link

Link copied!

@Po5

Im pretty sure there’s nothing natively built into PowerApps that can do what you want.

You could use variables to control the behaviour you want but it’d be tiresome to implement.

Was this reply helpful? Yes No
Drrickryp Super User 2024 Season 1 on at

Like (0)

Report
Copy link

Link copied!

@Po5

Not so difficult to implement. Just have the Search button OnSelect be

UpdateContext({var: Search(datasource, TextInput1.Text, "Column2Search")}) and set the Items property of the gallery to "var"

Was this reply helpful? Yes No
Po5 17 on at

Like (0)

Report
Copy link

Link copied!

I thought as much around nothing native being available.
I am curious around how I could use variables if you have an idea.

Cheers

Was this reply helpful? Yes No
Po5 17 on at

Like (0)

Report
Copy link

Link copied!

Unfortunately this provides the same functionality I already have.
It doesn't allow me to execute a search by hitting enter.

Was this reply helpful? Yes No
Community Power Pla... Microsoft Employee on at

Like (0)

Report
Copy link

Link copied!

@Po5

I've had a bit of a play around but can't get any variables to work how I want. The OnChange and OnSelect properties are the only options to use.

I think it's possible, I just don't have the time to mess around with it, sorry.

Was this reply helpful? Yes No
veztys 20 on at

Like (8)

Report
Copy link

Link copied!
Correct, there is nothing native available but not impossible.

Assuming you have the search text box and search button set up.
Change the Mode property of the search text control to TextMode.MultiLine
Add a Slider Control and hide it i.e Visible property = false
Set the Default property of the slider control to:

Len(txtQuery.Text)

4. The above code gets the OnChange Event of the Slider going on each keystroke. Therefore, set the OnChange event of the slider to:

// Capture what was typed. If you try doing this with the search text input control, // it does not work as the OnChange() event only fires when the focus leaves the control. // Hence using the slider control's OnChange as each keystroke triggers the OnChange event. Set(varSearchText; txtQuery.Text);; // Now check if <Enter> was pressed. // Checking for Chr(13) - Carriage Return (CR) does not work, // We check for Chr(10) - Line-Feed(LF): If(Find(Char(10); varSearchText)>0; // Remove the LF that was detected. Set(varSearchText; Left(varSearchText; Len(varSearchText)-1));; // Now mimic the Search button press. Select(btnSearch);; );;

5. Lastly, set the Default property of the search text control to varSearchText.

If I get time I will package it up in a file so you can just import it as a component.

Hope this solves the problem!

Was this reply helpful? Yes No
KevinGador 836 Moderator on at

Like (1)

Report
Copy link

Link copied!
the formula you given cannot be used.

this is the one that worked for me:

// Capture what was typed. Set(varSearchText, txtInput.Text); // Now check if <Enter> was pressed. // Checking for Char(13) - Carriage Return (CR) should work. If( Char(13) in varSearchText, // Remove the CR that was detected. Set(varSearchText, Left(varSearchText, Len(varSearchText) - 1)); // Now mimic the Search button press. Select(icnSend) )

Was this reply helpful? Yes No
MK-04030856-0 on at

Like (0)

Report
Copy link

Link copied!
Thanks! Works perfectly, except my Cancel Icon no longer works:

Reset(txtQuery);

I assume this is because the Default property is now set to varSearchText.
Does anybody know a solution to this?

EDIT: posted the question too quickly.
instead of Reset(txtQuery) i used Set(varSearchText, "").

Was this reply helpful? Yes No