Menu
Is there any pluin for Jquery mobile that allows to clear the text box?? I want something like this
When I implement the above demo, cross button comes out of the text box in Jquery Mobile.
Can someomne help me out. Thanks for your time.
my code as of now
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
<script type="text/javascript" src="jquery.clearable.js"></script>
<link rel="stylesheet" href="jquery.clearable.css" type="text/css" media="screen" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
</head>
<body>
<div data-role="page">
<div data-role="header">
<h1>Textbox Clear Demo</h1>
</div><!-- /header -->
<div id="content">
<input type="text" id="clearMe"></input>
<input type="text" id="clearYou"></input>
</div>
<div data-role="footer">
<small>© 2011 EyePax IT Consulting</small>
</div><!-- /footer -->
</div><!-- /page -->
<SCRIPT>
$(document).ready(function() {
$('#clearMe').clearable()
});
</SCRIPT>
</body>
</html>
931
Old question, but someone asked me about this today.
As of JQuery Mobile 1.3.0 you can just add:
data-clear-btn="true"
to your input control (except textarea) and a clear button will be rendered.
See new docs: http://jquerymobile.com/demos/1.3.0-beta.1/docs/forms/textinputs/#
Hope it helps any new searchers!
126
There is a tutorial for your demo with all the code you need:
http://viralpatel.net/blogs/2011/02/clearable-textbox-jquery.html
Just include the js file, add the class to all inputs:
<input type="text" id="clearMe" class="clearable" />
and run it:
<SCRIPT>
$(document).ready(function() {
$('.clearable').clearable()
});
</SCRIPT>
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
