Laravel 5.6 Javascript输入总和

时间:2018-04-04 09:31:23

标签: javascript php jquery laravel laravel-5

问题是如何递增输入id并检查所有输入和是否可以提交其@Mock表单,否则将弹出。最大的问题是它不是静态输入可以少或多。

这是我的表格exams.blade.php

i<50

2 个答案:

答案 0 :(得分:1)

您可以为输入字段提供一个公共类,然后在jquery中调用keyup函数来检测输入更改..每次发生更改时,您都可以计算值的总和,并相应地启用或禁用提交按钮

假设您为需要验证的所有输入字段提供了一个类numberInput

 $('.numberInput').keyup(function(e) {
      // check sum of input fields < 50 here and enable or disble the button
      var sum = 0;
      $.each($('input[type=number]'),function(){
        sum = sum+$(this).val();
      });
      if(sum<50) $(':input[type="submit"]').prop('disabled', false);
      else $(':input[type="submit"]').prop('disabled', true);

 });

答案 1 :(得分:1)

如果您使用jQuery,您可以将提交按钮更改为普通按钮并仅在满足要求时触发提交事件,否则您可以显示弹出窗口。

<form id="examsForm" method="post" action="{{ route('exams.custom') }}">
....
....
    <button type="button" class="sendExamsForm">Сонгох</button>
</form>

<script>
$(document).ready(function() {
            $(".sendExamsForm").click(function() {
                var sum = 0;
                $.each($('input[type=number]'),function(){
                    sum = sum + parseInt($(this).val());
                });
                if (sum < 50) {
                    $("#examsForm").submit();
                } else {
                    alert("Too many points");
                }
            });
        });
</script>

这样,如果总和> = 50,它将显示弹出窗口,否则提交表格。

JS小提琴: https://jsfiddle.net/rxz0ndb4/7/