Nida Nida - 1 month ago 17
Javascript Question

Jquery for masking of input for entering date correctly

I have used online jquery reference from https://raw.githubusercontent.com/igorescobar/jQuery-Mask-Plugin/master/src/jquery.mask.js in my project.

<script type="text/javascript">
var s = jQuery.noConflict();
s(document).ready(function () {
s(".mask_phone").mask('(999)-999-9999');
s(".datepicker").mask('99/99/9999');
});
</script>

<input type="text" class="datepicker">


It is not working. It works fine only when we add local copy of jquery and add reference to it. Due to some reason I cannot use this method.

Now I am trying to achieve this by custom jquery.

var $ = jQuery.noConflict();
$(document).ready(function () {

$(".datemask").keyup(function () {
if ($(this).val().length == 2) {
$(this).val($(this).val() + "/__/____");
} else if ($(this).val().length == 5) {
$(this).val($(this).val() + "/____");
}
});
});


Now as soon as user enter 16 the value becomes 16/__/____ the text cursor is at the end.

Please help me in making this jquery working same as masked input !!!

Answer

According to the documentation, jQuery Mask would work with all jQuery versions above 1.7. So please include jQuery library right before you included jQuery Mask plugin. And please consider using one of the public CDNs for the script source rather than its source code address. I usually prefer cdnjs.com.

https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.0/jquery.mask.min.js