Set maximum number input text from database in php/javascript

Question

So I have an input text that is used to determine the amount of the purchase of item in my shopping cart. Each item has a different maximum amount of purchases, the maximum number of purchases (max) is obtained from the mysql database. I want if user input the number of items exceeds the maximum limit, then a warning appear.

The shopping chart and the amount :

enter image description here

The database example:

id_item | item          | brands    | max
- - - - - - - - - - - - - - - - - - - - - - -
1       | Baskom Sedang | Lion Star |2
2       | Pinset Anatomi| Selako    |5
3       | Tromol        | Selako    |7

So for example if i type 3 in the "Baskom sedang" amounts (exceeding max limits), i want alert to appear.

I know I'm supposed to include a javascript/code that I try, but I do not have any idea about the javascript, i'm not good with javascript. Thank you..

score 1 · Answer 1 · edited May 23 '17 at 11:43

1

Could this be what you are looking for? Limit numerical values

Just would need to grab the value from the database and change the upper limit appropriately.

edited May 23 '17 at 11:43

Community

1
1

answered Jan 20 '15 at 05:33

SharpCode

1,385
3
12
29

@Muhammad Fahmy just tested it and it works. Let me know how you go. – SharpCode Jan 20 '15 at 05:43
More or less like that, One thing I haven't been able to is, how to grab the value from database to javascript? – Ujang Hardman Jan 20 '15 at 06:26

score 1 · Answer 2 · answered Jan 20 '15 at 05:34

1

it's easy to validate with server side.

the logic is like this.

if user click checkout or submit , then get max from database , then compare it with user input , if input more than max then show error.. :D

answered Jan 20 '15 at 05:34

Dark Cyber

2,181
7
44
68

yeah, i could do it with submit method, but my boss want to validate it when user typing the input text.. -_- – Ujang Hardman Jan 20 '15 at 06:23

Bandon · Accepted Answer · 2015-01-21T02:05:09.927

1

There are 3 ways to solve it:

Transfer max info to front-end
Check when user submit
Asynchronous data check, like Jquery ajax

Transfer max info to front-end

Just placed your max info into some hidden area, and use javascript to get and check that.

function check(obj){
  var max = obj.getAttribute("data-max");
  if(parseInt(obj.value) > parseInt(max)){
    alert("Amount out of max!");
  }
}

<input name="amount" value="0" data-max="3" onkeyup="check(this);"/>

But this way is not recommended and should be avoided, since users can achieve your storeage data by checking source code.

Check when user submit

Check the amount with max value at server-side, which leads to poor user experience.

Asynchronous data check

This is mostly recommended and used, which get data asynchronously. You can try jquery.

Assuming your server-side lang is php, you can make a file checkMax.php:

<?
  $amount = $_POST["amount"];
  $item_id = $_POST["item_id "];
  /* get your max data from database using item_id, then assign $max
     ...
  */
  echo $amount > $max ? 1 : 0

Then you can check amount by jquery ajax.

<input name="amount" class="amount" data-id="1" value="0"/>
$(".amount").change(function(){
  var amount = $(this).val();
  var item_id = $(this).attr("data-id");
  $.post("checkMax.php", {"amount": amount, "item_id": item_id}, function(data){
     if(data == "1")alert("Amount out of Max!");
  });
});

edited Jan 21 '15 at 02:05

answered Jan 20 '15 at 05:53

Bandon

809
1
6
14

Thank you, let me try first.. :) – Ujang Hardman Jan 20 '15 at 06:26
hmm, there's no error, it's just nothing happened when i type the amount > max... -_- – Ujang Hardman Jan 21 '15 at 02:00
1

First, dircetly visit `checkMax.php` with parameters set, to see if the result echoed is right. Second, alert(data) in the `$.post` callback and check. – Bandon Jan 21 '15 at 02:22
oh my bad my bad, i forgot to include the connections :), it's works now, but the alert is appear more than once, so i need to keep click the ok alert more than once until it's disappear, and after i click the alert closed, the alert will appear again if i didn't delete/change the amount.. – Ujang Hardman Jan 21 '15 at 02:38
Yes it triggers every time the value changed, and the `alert` function is just for testing, you can change it to any other logics you want. – Bandon Jan 21 '15 at 02:47
hmm, but i change the amount to > max and then click ok from the alert, the alert disappear, but then appear again even though I didn't do anything... -_- – Ujang Hardman Jan 21 '15 at 02:59
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/69266/discussion-between-bandon-and-muhammad-fahmy). – Bandon Jan 21 '15 at 03:03
I already have the solution for that, you really helped me, thank you very much.. :) – Ujang Hardman Jan 21 '15 at 09:12

Set maximum number input text from database in php/javascript

3 Answers3

Linked