0

I want take time value as input and i want to make : fixed while entering input.

For example: 12:23:24 while entering this value as input i want to make the colon fixed and not editable. I am working on jsp and jquery and my backend is in java. Is there a way possible?

<input type="text" name="test_tat1" onclick="changecolor6665()" id="tat"style="border-color: darkgray;" class="form-control p-input test_tat "aria-describedby="labtest_name" autocomplete="off"   placeholder="Test Tat" value="${tatV}" >

This is my input field.

1 Answers1

0

As said, there is no support for this with JSP.

I guess you want something like this as your jQuery/javascript:

$("input[name='masknumber']").on("keyup", function(){
    $("input[name='number']").val(destroyMask(this.value));
this.value = createMask($("input[name='number']").val());
})

function createMask(string){
    console.log(string)
return string.replace(/(\d{2})(\d{2})(\d{2})/,"$1:$2:$3");
}

function destroyMask(string){
    console.log(string)
return string.replace(/\D/g,'').substring(0, 6);
}

With this as your HTML:

<input type="text" name="masknumber">
<input type="text" name="number" style="display:none;">

Found similar here

EDIT

Did you insert the jQuery, right?

This one is working for me:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>

<input type="text" name="masknumber">
<input type="text" name="number" style="display:none;">

<script>    
$("input[name='masknumber']").on("keyup", function(){
    $("input[name='number']").val(destroyMask(this.value));
this.value = createMask($("input[name='number']").val());
})

function createMask(string){
    console.log(string)
return string.replace(/(\d{2})(\d{2})(\d{2})/,"$1:$2:$3");
}

function destroyMask(string){
    console.log(string)
return string.replace(/\D/g,'').substring(0, 8);
}   
</script>
</body>
</html>
rhenesys
  • 174
  • 1
  • 11