DNK Gif

Dot Net Knowledge

Labels

Sunday, 6 September 2015

Allow only numer input in textbox using jquery

Allow only numer input in textbox

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){   

var textIdList= ["#tbx", "#tbx1", "#tbx2"];
allowNumberOnly(textIdList);
});
function allowNumberOnly(textIdList){
alert(1);
for(i=0; i<textIdList.length; i++)
{
alert(textIdList[i]);
abc(textIdList[i]);
}
}
function abc(id){
$(function () {
alert(2);
        $(id).bind("keypress", function (e) {
            var keyCode = e.which ? e.which : e.keyCode            
            var result = (keyCode >= 48 && keyCode <= 57);            
            return result;
        });
        // Restricting the Paste into textbox
        $(id).bind("paste", function (e) {
            return false;
        });
        // Restricting the Cut from textbox
        $(id).bind("cut", function (e) {
            return false;
        });
        // Restricting the Copy from textbox
        $(id).bind("copy", function (e) {
            return false;
        });
        // Restricting the drag and drop any value into textbox
        $(id).bind("drop", function (e) {
            return false;
        });        
    });
}
</script>
<style>
.important {
    font-weight: bold;
    font-size: xx-large;
}

.blue {
    color: blue;
}
</style>
</head>
<body>
<h2 class="test">This is a heading</h2>
<p class="test">This is a paragraph.</p>
<p>This is another paragraph.</p>
<input type="text" class="blue important" id="tbx"></input>
<input type="text" class="blue important" id="tbx1"></input>
<input type="text" class="blue important" id="tbx2"></input>
</body>
</html>

No comments:

Post a Comment