gtroop
gtroop

Reputation: 293

Prevent user to input value larger than from other input value

How do i prevent and give alert so user can't input the value of totalontarget and totalofftarget to be larger than totalofservices

<script>
   $(document).ready(function() {
     $('.totalofservices').keyup(function(){
       $(this).closest('tr').find(".totalontarget").val($(this).val());
       $(this).closest('tr').find(".totalofftarget").val("0");
     });
   });
</script>

for($x = 1; $x <= 3; ++$x) {
    echo "
    <tr>
      <td>Zone $x</td>
      <td><input style='text-align:center' class='form-control totalofservices' type='text' size='20' id='totalofservices[]' name='totalofservices'></td>
      <td><input style='text-align:center' class='form-control totalontarget' type='text' size='20' id='totalontarget' name='totalontarget[]'></td>
      <td><input style='text-align:center' class='form-control totalofftarget' type='text' size='20' id='totalofftarget' name='totalofftarget[]'></td>
    </tr>";
}

Upvotes: 0

Views: 82

Answers (2)

Phelipe Rocha
Phelipe Rocha

Reputation: 186

Try something like that

$('.totalontarget, .totalofftarget').on('keyup', function(e){
    var max = $(this).parent().parent().find('.totalofservices').val();

        if ($(this).val() > max) {
           alert('Value more that ' + max);
           e.preventDefault();
        }
});

Upvotes: 0

DaMatt91
DaMatt91

Reputation: 726

Check this out : https://jqueryvalidation.org/. Anyway, even if client validation could look more user-friendly, it should be implemented also in the server side.

Upvotes: 1

Related Questions