<ons-input> clear button
-
Several mobile frameworks have a clear button that clear text if there is any text in the input element. This is a very useful feature to have.
Can this be implemented in Onsen UI?For example jQueryMobile provide this option:
<input data-clear-btn="true" data-mini="true" id="text-5" value="" type="text">Note: data-clear-btn=“true”
Here is a jsFiddle demo: http://jsfiddle.net/kqgkta8r
Also, your Monaca for iOS has this feature:
Note: HTML5 has a input type=“search” but it does not work on mobile.
-
@jamal Try with
type="search". It can even be customized with-webkit-search-cancel-buttonselector.Edit: Didn’t see your note :sweat_smile: It works for me on Android but looks like there is a bug or a style change on iOS… https://stackoverflow.com/questions/35583503/input-type-search-no-longer-shows-cancel-button-x-under-ios
-
@Fran-Diox, well it looks like Apple is slow at fixing things more than later and 2 major version of iOS.
How come you have it in the Monaca Debugger program for iOS? Should I assume you developed it in a different framework?
-
@jamal Not sure about it since I didn’t make the debugger myself but it just looks like a custom div. I’ll discuss with the team about adding this following android and ios specs.
-
@Fran-Diox, that would be awesome! Thanks!
-
BTW, ionic has this feature and other useful properties.
<ion-input placeholder=“Clear Input” clearInput></ion-input>
https://ionicframework.com/docs/api/components/input/Input/
If course, I would :green_heart: to see it in OnsenUI
