Input[type="text"] only Accept Number(Numeric Value), codes in JavaScript

-

 Input[type="text"] only Accept Number(Numeric Value), codes in JavaScript


<!DOCTYPE html>
<html lang="en">
  
<head>
    <meta charset="utf-8">
    <meta name="viewport" 
          content="width=device-width, initial-scale=1">
    <style>
        div {
            width: 400px;
            height: 130px;
            border: 2px solid black;
            padding: 15px;
            position: absolute;
            left: 27%;
        }
    </style>
</head>
  
<body>
    <center>
        <h1 style="color:green;padding:13px;">springBoot & JS
       SSSs
        </h1>
        <h3>
          Force input field to take only numbers as an input
        </h3>
    </center>
  
    <div class="container">
        <form name="inputnumber" 
              autocomplete="off">
            <b>Register No:</b>
            <input type="text" 
                   onkeypress="return onlyNumberKey(event)" 
                   maxlength="11" 
                   size="50%" />
  
            <br>
            <br>
            <b>Ph. Number:</b>
            <input type="tel" 
                   size="50%" 
                   onkeypress="return onlyNumberKey(event)" />
  
            <br>
            <br>
            <center>
                <b>Age:</b>
                <input type="number" 
                       placeholder=" Only 12+ allowed" 
                       min="12" />
                <input type="submit"
                       value="Submit" 
                       onclick="return detailssubmit()">
            </center>
        </form>
    </div>
    <script>
        function onlyNumberKey(evt) {
              
            // Only ASCII character in that range allowed
            var ASCIICode = (evt.which) ? evt.which : evt.keyCode
            if (ASCIICode > 31 && (ASCIICode < 48 || ASCIICode > 57))
                return false;
            return true;
        }
    </script>
    <script>
        function detailssubmit() {
            alert("Your details were Submitted");
        }
    </script>
</body>
  
  
</html>

Output: 

Comments

Post a Comment

Popular posts from this blog

image work in springboot

-
 Bean file :         @Lob @Column(length = Integer.MAX_VALUE) private byte[] images;          public byte[] getImages() {           return images;            }          public void setImages(byte[] images) {           this.images = images;            } save image controller :       @PostMapping("/") public String saveHolidayPackage(@ModelAttribute CreateHolidayPackageOne createHolidayPackageOne,               @RequestParam("image") MultipartFile file,HttpSession httpSession) throws IOException { createHolidayPackageOne.setImages(file.getBytes()); createHolidayPackageOneRepo.save(createHolidayPackageOne); return "Admin/CreateHolidayPackageDetails"; } retrieve image from database controller :         ...
Read more

Springboot important annotation

-
Image
  Spring Boot Annotations Spring Boot’s annotations are key to getting up to speed with the framework. They allow you to direct the framework to do your bidding, taking control and overriding its defaults when needed. Annotations are quick, easy to use, and orders of magnitude faster than building the equivalent functionality yourself. You can learn more in Spring’s documentation. The  PDF  or  web  versions are essential reading if you plan on working with Spring Boot. Knowing how to use annotations can level up your game and help you get the most out of the framework. Listed below are several common annotations, some of them with sample code. Spring Boot works with  Java ,  Kotlin , and Groovy. I’ll use Java for the examples in this article. Basic Setup @SpringBootApplication @Configuration @ComponentScan @EnableAutoConfiguration Request Responses @GetMapping @RequestMapping @RequestParam Component Types @Component @Service @Repository @Controller @R...
Read more