Menu
Having some trouble with bootstrap, so some help would be awesome. Thanks
What I would like:(top part)
My current code:
<div class="form-group"> <input type="text" class="form-control" id="findJobTitle" name="findJobTitle" placeholder="Job Title, Keywords" onkeyup="showResult()"> </div> Current Screenshot:
598
The easiest way to add an input box with a clear button is to add an input element with the type attribute set to search . Then when we type into the input box, we see the clear button displayed. And we can click on it to clear its value.
To clear an input field after submitting:Add a click event listener to a button. When the button is clicked, set the input field's value to an empty string. Setting the field's value to an empty string resets the input.
To get something like this
with Bootstrap 3 and Jquery use the following HTML code:
<div class="btn-group"> <input id="searchinput" type="search" class="form-control"> <span id="searchclear" class="glyphicon glyphicon-remove-circle"></span> </div> and some CSS:
#searchinput { width: 200px; } #searchclear { position: absolute; right: 5px; top: 0; bottom: 0; height: 14px; margin: auto; font-size: 14px; cursor: pointer; color: #ccc; } and Javascript:
$("#searchclear").click(function(){ $("#searchinput").val(''); }); Of course you have to write more Javascript for whatever functionality you need, e.g. to hide the 'x' if the input is empty, make Ajax requests and so on. See http://www.bootply.com/121508
102
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
