Search jQuery

jQuery Forum

jQuery Mobile

britesc

Icons and Toggles in Input Fields

in jQuery Mobile • 3 years ago

Hi,

I would like to be able to put an icon on the left-hand side in an input field like the search field has.

Additional I would like to add a toggle icon on the right-hand side of a password field to show and hide the password. This seems fairly prevalent on most password fields these days.

I think the toggle is just a case of switching the field type from password to text and back etc.

Through CSS I can put a small background icon in an input field but it disappears when text is entered also the text does not start after the icon but flush against the left-hand edge of the input field. This is the same with placeholder text, it is hidden behind the icon.

I am usng JQM 1.4.5 and JQ 1.11.1

Thanks and kind regards,

Replies(1)

watusiware

Re: Icons and Toggles in Input Fields

3 years ago

You've given only a vague textual description of what you want. And so we would have to guess.

Do you want your icon to the left of the input box? Inside the input box?

If you want it inside the input box, how is the user to see what they typed, if the icon doesn't disappear once the user types?

Usually, these icons are placed to the left of the input box. If they appear INSIDE the input box, generally the border of the input box is faked. That is, CSS is used to remove the border of the real input box, and it is placed inside a div or other element that will have the visible border.

To many things to guess, and not really a jQuery Mobile problem. CSS/HTML.

That said, honestly, nobody should be starting a jQuery Mobile project in 2019! It is a dead project that hasn't been updated since October 2014 - 5 years ago! And it will never be updated.

Those of us who were once experts at jQuery Mobile have largely forgotten the details! It will be hard to get help, and it will slowly break further as browsers are updated.

If you are updating an OLD project, I suggest you not put in too much effort, while considering if it is worth your while to switch to something else.

If this is a NEW project, I suggest you STOP NOW and look for another solution.

Top Reply

Response title

Attachments

jQuery Forum

Icons and Toggles in Input Fields

Replies(1)

Re: Icons and Toggles in Input Fields

Statistics

Tags

Actions