How to add icons to inputs? - Printable Version

How to add icons to inputs? - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Development (https://forum.codeigniter.com/forumdisplay.php?fid=6)
+--- Forum: CodeIgniter 3.x (https://forum.codeigniter.com/forumdisplay.php?fid=17)
+--- Thread: How to add icons to inputs? (/showthread.php?tid=87378)

How to add icons to inputs? - MohinSonanda - 04-12-2023

How can I add a prepend icon or an append icon to an input box using form_input() in PHP? The current code I have only includes basic properties like name, value, id, placeholder, and class. I want to add a bootstrap 3 styling to the input box such as a prepend icon or an append icon, for example: <span class="input-group-addon" id="basic-addon2">@example.com</span>. I have checked the CI3 manual but could not find any specific information. Any suggestions or solutions would be appreciated.

RE: How to add icons to inputs? - InsiteFX - 04-12-2023

READ:

CSS to put icon inside an input element in a form

RE: How to add icons to inputs? - JustJohnQ - 04-13-2023

If you want to prepend or append an icon to a text input, you can use the following code (when using bootstrap):

Code:
<div class="input-group">

   <span class="input-group-addon">@</span>

   <input type="text" class="form-control" placeholder="Username">

</div>

or, although not tested, using the form_input method:

Code:
<div class="input-group">

   <span class="input-group-addon">@</span>

   <?php echo form_input($fielddata); ?>

</div>