0

I need to set the maximum value of an input number to the quantity left in the database. Is it possible or is there some ways to do this? I need to validate first if the input value is equal or less than to the stocks left and if greater than it will prompt the message that the input must be less than or equal to the maximum value.

the database sample:

id_item | item          | brands    | max
- - - - - - - - - - - - - - - - - - - - - - -
1       | Shampoo       |creamsilk  |2
2       | conditioner   |creamsilk  |5
3       | soap          |safeguard  |7
Zoe
  • 27,060
  • 21
  • 118
  • 148
John
  • 11
  • 3
  • don't handle this within javascript (client side) – Raymond Nijland May 06 '18 at 15:02
  • how about in jquery/ajax – John May 06 '18 at 15:07
  • no you should never validate user input on the client side but always on the server side.. https://stackoverflow.com/questions/162159/javascript-client-side-vs-server-side-validation – Raymond Nijland May 06 '18 at 15:08
  • @RaymondNijland we are in 2018 man, client-side validation is a must have -_- – h1b9b May 06 '18 at 15:13
  • 1
    also in 2018 or 2018+ i was trying to say we shouldn't be trusting on client-side validation only.. @h1b9b always include server validation also. – Raymond Nijland May 06 '18 at 15:15
  • what will be the good way to solve it? im a beginner in javascript/php – John May 06 '18 at 15:17
  • 1
    In this case, you want to limit user input using a value you already have, no need to send a request to validate the input for showing an alert, client-side validation is enough. But when posting the form you still need to validate what you got on your server – h1b9b May 06 '18 at 15:22
  • ive been developing inventory and point of sales, in example if the quantity of shampoo is 50, then i order 51 if should not continue or there will be a message/alert that you have exceed the maximum limit – John May 06 '18 at 15:30

5 Answers5

1

In the client side, you can validate the input value using the onChange event
Exemple:

document.getElementById('input')
  .addEventListener('change', (event) => {
      if (event.target.value > 3) {
           alert('there is only 3 shampoo left');
      }
  });
<input type="number" id="input" />
h1b9b
  • 1,010
  • 5
  • 16
  • how about if the maximum value will be coming from the database?So for example if i type 3 in the "shampoo" amounts (exceeding max limits), i want alert to appear. is this possible – John May 06 '18 at 15:08
  • as of getting the value from the database, it depends how are you connected to the DB. With the information I have, I don't know – h1b9b May 06 '18 at 15:12
  • oh thank you it helps, my adviser said that it should not be exceed to the total quantity of product that the database had, ive been developing an inventory and point of sales – John May 06 '18 at 15:15
0

check int browser use JS .when the input's(for eaxmple) value changes,an event is tritter and in the event handler ,some codes are used to check the value . It seems that mvvm mode is suitable to the situation.

cn-deng
  • 51
  • 1
  • 8
0

if you want to use javascript, you can use

Math.min(value,max);

this function gets minimal value from parameters.

this would be answer.

user9735269
  • 60
  • 9
0

HTML 5 now offers a way to specify limits on values of number fields in forms. For example you could put this in your HTML page.

 <input id="qty" type="number" min="0" max="42"> </p>Order now, only 42 left!</p?

Then the user won't be able to enter a too-high number. You must, of course, validate this number again on your backend when the user submits the form (users can change html on web pages easily; also, older browsers ignore min and max attributes).

O. Jones
  • 103,626
  • 17
  • 118
  • 172
0

You need to provide what database framework you are using and what backend you are using since it wont be just javascript itself. Assuming this is MySql and PHP;

You can easily hard code your max value, though this is never advised. Inside your for loop, when looping through the products:

   <input
   type="number"
   data-max="<?php echo $rows[$i]["max"];?>"
   min="0"
   max="<?php echo $rows[$i]["max"];?>"
   class="hasMaxInput">

To further use alerts:

<script>
$(".hasMaxInput").on("change", function(e) {
    var max=$(this).attr("data-max");
    var inp=$(this).val();
    if (inp >= max) {
        alert("Exceeded amount value!");
        $(this).val(max);
    } else {
         // cont.
    }
});
</script>
Kearl
  • 86
  • 5