OLDMONK OLDMONK - 4 months ago 17
Javascript Question

Jquery Math operation not working

I am trying to validate data of two textboxes. I have this textbox for submitted amount.

<div class="col-md-3">
<label for="SubmittedAmountTextBox">Total Submitted Amount</label>
<Everest:AmountTextBox runat="server" ID="SubmittedAmountTextBox" TriggerDenomination="True" autocomplete="off" CssClass="loan-amount-input submitted-amount"></Everest:AmountTextBox>
<asp:RequiredFieldValidator runat="server" ID="SubmittedAmountTextBoxRequiredFieldValidator" Display="Dynamic"
ErrorMessage="Required" ControlToValidate="SubmittedAmountTextBox" CssClass="alert alert-error" Style="padding: 5px;" SetFocusOnError="true" />
</div>


And an another textbox from a usercontrol.

<div class="col-sm-2">
<asp:TextBox runat="server" ID="LoanCollectionBalanceTextBox" CssClass="form-control input-sm" data-bind-property="CollectionBalance" />
</div>


An ajax call gets all the data for the textbox. I am just trying to through a bootbox alert if
SubmittedAmountTextBox
input is greater then
LoanCollectionBalanceTextBox
.

My Jquery Function for Validation:

function validateAmount() {
var sbmtAmount = $('#SubmittedAmountTextBox').val();
console.log(sbmtAmount);
var loancollecBlnce = $('#LoanCollectionBalanceTextBox').val();

if (sbmtAmount > loancollecBlnce) {
alert(sbmtAmount);
alert(loancollecBlnce);
debugger;
//bootbox.alert("Submitted amount is higher then Collection Balance")
$("#SaveButton").attr('disabled', 'disabled');
} else {
$("#SaveButton").attr('disabled', false);
}
}


And the Blur event of
SubmittedAmountTextBox


$('#SubmittedAmountTextBox').on('blur', function (evt) {
var checkedValue = $('input[id*=loanTypeCheck]:checked').val();
if (checkedValue === "Cash") {
$(this).trigger('showDeno', [$(this)]);
} else if (checkedValue === "Dharauti") {
validateAmount();
}
});


And the weird part is it does validate if the
SubmittedAmountTextBox
>
LoanCollectionBalanceTextBox
. Suppose
LoanCollectionBalanceTextBox
is 12500 and if i enter more then that it throws the alert. And if i enter 100 it does not because 12500 > 100 but if i enter 200, 300 anything between 1000 it does throw the error. I searched everwhere couldn't get hang of this.

Answer

you should have to convert your textbox values in float value from string. Please replace your validateAmount function with below one. Your code is not working because in it string are comparing instead of converting the textbox values in float.

function validateAmount() {
  var sbmtAmount = parseFloat($('#SubmittedAmountTextBox').val();
  console.log(sbmtAmount));
  var loancollecBlnce = parseFloat($('#LoanCollectionBalanceTextBox').val());

  if (sbmtAmount > loancollecBlnce) {
      alert(sbmtAmount);
      alert(loancollecBlnce);
      debugger;
      //bootbox.alert("Submitted amount is higher then Collection Balance")
      $("#SaveButton").attr('disabled', 'disabled');
  } else {
      $("#SaveButton").attr('disabled', false);
  }
}
Comments