Good day all
I am building my first ionic 4 mobile application, and have a question about how label, icons and other elements can be connected to a form input.
In normal HTML forms you have a relationship between labels and inputs using the “for” attribute, like so:
<label for="name">Please enter name</label> <input type="text" id="name" name="name"/>
With this relationship in place the input field gains focus when you either click on the label or on the input itself to gain focus on the input.
In ionic you use ion-label and ion-input instead of the default HTML form elements, and these seem to not share this capability.
I am specifically interested in using an icon as the aforementioned label. I tried the following without any success:
<ion-item> <ion-label for="searchText"> <ion-icon name="search"></ion-icon> <!--name here refers to the icon displayed--> </ion-label> <ion-input id="searchText" name="searchText" type="text" placeholder="Search" ></ion-input> </ion-item>
Any advice would be greatly appropriated