Question

如何根据余额输入框设置金额输入框的最大值？例如，如果余额输入框的值为500，则金额输入框的最大值为500。因此当用户在金额输入框中输入的数字大于余额输入框的值时，将显示错误消息。我怎样才能做到这一点？我正在使用 angularjs 进行验证，但它似乎不适用于我的代码。

这就是我所做的：https://jsfiddle.net/mbnxdvpw/

这就是我检索余额数据的方式。当用户点击支付图标时，它会显示一个模式，成功后，将在余额输入中检索数据库中的余额数据。

function view_payment(payment_sales_id) {
    var modal = $('#payment-sales-modal');
    $.ajax({
        type: 'POST', 
        url: url + 'GetPaymentDetailsById', 
        data: { payment_sales_id : payment_sales_id }, 
        dataType: 'json',
        success: function (data) {
            modal.modal({ backdrop: 'static', keyboard: false});
            modal.find($('#payment_sales_id')).val(payment_sales_id);
            modal.find($('#payment_net_amount')).val(data.sales_net_amount);
            modal.find($('#payment_balance')).val(data.sales_balance);
        }
    });
}

HTML

<div class="form-group">
    <label for="">Balance <small>*</small></label>
    <input type="text" id="payment_balance" name="payment_balance" placeholder="Balance" class="form-control" ng-model="payment_balance" readonly>
</div>

<div class="form-group">
    <label for="">Amount <small>*</small></label>
    <input type="text" id="payment_amount" name="payment_amount" placeholder="Amount" class="form-control" ng-model="payment_amount" ng-pattern="/^[0-9]+\.?[0-9]*$/" max="payment_balance.value">
    <span ng-messages="formPayment.payment_amount.$error" ng-if="formPayment.payment_amount.$dirty">
        <strong ng-message="pattern" class="text-danger">Please type numbers only.</strong>
        <strong ng-message="max" class="text-danger">Please enter a value less than or equal according to balance.</strong>
    </span>
</div>

Answer 1

首先，您直接在输入 payment_balance 上注入值，这不是最干净的角度方式。您应该使用 $scope （查看下面我的 js 示例），这样您就可以即时更改它，而无需一遍又一遍地查找输入（可能不是这个特定代码的问题，但要记住一件事).

其次，您应该使用 <form> 来检查 $error 或 $dirty 之类的属性。话虽如此，我做了一个小example（不聚焦检索到的数据）。

快乐编码 =}

根据另一个输入框设置输入框的最大值

1 个答案: