Check First Value Greater in Multiple Inputs with Same Class Name using jQuery

Today we check a task about How to Check First Value Greater in Multiple Inputs with Same Class Name using jQuery.

Here we use some standard jQuery functions,

  1. Bootstrap CDN
  2. jQuery CDN
  3. Creating number input fields
  4. Take the value from input fields using jQuery.
  5. Using jQuery loop to check all values and store into an array.
Check First Value Greater in Multiple Inputs with Same Class Name using jQuery

Included CDN Links

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<!-- jQuery library -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- jQueryUI library -->
<link href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css">

Creating Number Input Fields

<div class="col-md-3">
<input id="fnumber" placeholder="Enter 1st number..." type="number" class="form-control input-sm User_number"/>
</div>
</br>
<div class="col-md-3">
<input placeholder="Enter 2nd number..." type="number" class="form-control input-sm User_number"/>
</div>
</br>
<div class="col-md-3">
<input id="second" placeholder="Enter 3rd number..." type="number" class="form-control input-sm User_number"/>
</br>
<button id="check" class="btn btn-primary">Check</button>
</div>

Complete JS to Check First Value Greater

<script>
$(document).ready(function(){
    $("#check").click(function(){
      var inputs = $(".User_number");
      var splashArray = [];
      var first_num;
      for(var i = 0; i < inputs.length; i++){
          var first_num = $(inputs[0]).val();
          splashArray.push($(inputs[i]).val());
        }
      var user_value = Math.max.apply(Math,splashArray);
      if(user_value == first_num){
        alert(first_num+" :1st number greater");
      }else{
        alert(first_num+" :1st number is not greater than this "+user_value+" number");
      }
      
    });
});
</script>

Complete source to Check First Value Greater in Multiple Inputs with Same Class Name using jQuery,

See the Pen Check First Value Greater in Multiple Inputs with Same Class Name by Bikash Panda (@phpcodertech) on CodePen.

Also Check:

Was this article helpful?
YesNo
My name is Bikash Kr. Panda. I own and operate PHPCODER.TECH, my native place in Odisha. I am a Web Programmer by profession and working on more than 50 projects to date. My passion is working on the web-based project using PHP and relate to all CMS and frameworks which is based on PHP.
Posts created 163

Leave a Reply

Your email address will not be published. Required fields are marked *

Related Posts

Begin typing your search term above and press enter to search. Press ESC to cancel.

Back To Top
mariobet - supertotobet - escort -

takip7.com

We are now accepting Guest Posting and creation of Backlinks
This is default text for notification bar