Search type input missing clear x icon

Wappler Version : 6.0.0
Operating System : 13.5.1
Server Model: PHP
Database Type: MySQL
Hosting Type: Docker

What do you think should happen?

When a search type input has text, a x icon appears for clearing the text.

What actually happens?

The x icon never appears.

How to reproduce

Add a search input, type some text.

<input id="search_name" name="s_name" class="form-control form-control-sm" dmx-on:changed.debounce:400="run([{run:{action:`flowPrepareWebAppSearch.run()`}},{condition:{if:`(value!=\'\')`,then:{steps:{run:{action:`qmWebApp.set(\'s_name\',value)`}}},else:{steps:{run:{action:`qmWebApp.remove(\'s_name\')`}}}}}])" dmx-bind:value="query.s_name" type="search">

Hello, i am not sure what icon are you referring to? None of the form input components in Wappler have any options like additional icons etc.

Sorry, perhaps icon isn’t the correct thing to call it. I just wasn’t sure what else to call it. Here is a video of a previous web app I built with the search type input. Notice the X appears when there is text, then you click the x to clear the text.

Screenshot from 2023-11-25 18-15-54

Works just fine here, with type=“search”…

Full code sample for this input:

<input type="search" class="form-control form-control-lg" placeholder="Search products..." id="search" name="search" is="dmx-input">

That’s not anything related to Wappler. These icons are automatically added inside the inputs by the browsers which support this.

1 Like

My bad, didn’t realize it was a browser support feature. Looks like it doesn’t work in Firefox. Works fine in Chrome and Safari.

I used to develop in Chrome but it had a different issue so I switched to Firefox. I guess I should have tried a different browser first. Sorry

What was you issue with Chrome @TwitchBlade?

It was this, but it appears to be working again in chrome now. I don’t recall updating Chrome so perhaps something in the latest Wappler fixed it. :man_shrugging:

1 Like