Wednesday 14 August 2013

jQuery tips

jQuery Allow Only Numbers in Textbox using JavaScript


To restrict user to enter only numbers in textbox we need to write the following code


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery allow only numbers or numeric characters in textbox</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
$(function () {
$('#txtNumeric').keydown(function (e) {
if (e.shiftKey || e.ctrlKey || e.altKey) {
e.preventDefault();
} else {
var key = e.keyCode;
if (!((key == 8) || (key == 46) || (key >= 35 && key <= 40) || (key >= 48 && key <= 57) || (key >= 96 && key <= 105))) {
e.preventDefault();
}
}
});
});
</script>
</head>
<body>
<div>
<input type="text" id="txtNumeric" />
</div>
</body>
</html>

jQuery Allow Only Alphabets in Textbox using JavaScript


To allow only alphabets in textbox using JQuery we need to write the following code


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Allow only alphabets in textbox using jquery</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
$(function () {
$('#txtNumeric').keydown(function (e) {
if (e.shiftKey || e.ctrlKey || e.altKey) {
e.preventDefault();
} else {
var key = e.keyCode;
if (!((key == 8) || (key == 32) || (key == 46) || (key >= 35 && key <= 40) || (key >= 65 && key <= 90))) {
e.preventDefault();
}
}
});
});
</script>
</head>
<body>
<div>
<b>Enter Text:</b><input type="text" id="txtNumeric" />
</div>
</body>
</html>

jQuery Allow Alphanumeric (Alphabets & Numbers) Characters in Textbox using JavaScript


To allow only alphabets & numbers in textbox using JQuery we need to write the following code


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery Allow only alphanumeric characters in textbox</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
$(function () {
$('#txtNumeric').keydown(function (e) {
if (e.shiftKey || e.ctrlKey || e.altKey) {
e.preventDefault();
} else {
var key = e.keyCode;
if (!((key == 8) || (key == 32) || (key == 46) || (key >= 35 && key <= 40) || (key >= 65 && key <= 90) || (key >= 48 && key <= 57) || (key >= 96 && key <= 105))) {
e.preventDefault();
}
}
});
});
</script>
</head>
<body>
<div>
<b>Enter Text:</b><input type="text" id="txtNumeric" />
</div>
</body>
</html>

jQuery Disable Cut Copy Paste Options in Textbox


To disable cut, copy and paste functionality for the Textbox we need to write the code like as shown below


<script type="text/javascript">
$(function() {
$('#txtName').bind("cut copy paste", function(e) {
e.preventDefault();
});
});
</script>
If you want to see it in complete example write the code like as shown below


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Disable Cut, Copy and Paste Options in textbox using jQuery</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
$(function() {
$('#txtName').bind("cut copy paste", function(e) {
e.preventDefault();
});
});
</script>
</head>
<body>
<div>
<input type="text" id="txtName" />
</div>
</body>
</html>

Posted by at

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)