locked
Page processing even after alert. RRS feed

  • Question

  • User411771660 posted

    I have a function to validate two textboxes.When user clicks on the save button that function is called.And the parameter for the said function comes from a webmethod.

    All other validation inside the savebutton click works but this.

    The function code :

      function checkRemainingInterestStatus() {
            var remainingInterest = parseFloat($("#ActualRemainingInterestTextBox").val());
            var remainingPrinci = parseFloat($("#ActualRemainingPrincipalTextBox").val());
            $.ajax
            ({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "/WebMethods/Misc.asmx/GetRemainingInterestParamater",
                success: (function(data) {
                    var result = data.d;
                    if (result === false) {
                        debugger;
                        //alert('test');
                        if (remainingInterest > 0 || remainingPrinci < 0) {
                            alert('Reached here');
                            //bootbox.alert(
                            //    '<b class="text-red">Invalid Data</b><br/>Submitted Amount cannot be less then Fine,Penalty and Interest.');
                            return false;
                        }
                    }
                }),
                error: (function() {
                    alert("error");
                })
            });
    
        }

    It gets inside the If statement and gives the alert but the page processes and postback happens.

    Savebutton click

      $('#SaveButton').on('click', function (e) {
            e.preventDefault();
           
            var remPrincipal = $("#ActualRemainingPrincipalTextBox").val();
            if (!validateRemainingPrincipal(remPrincipal)) {
                bootbox.alert('<b class="text-red">Invalid Remaining Principal</b><br/>Remaining Principal Cannot be negative.');
                return false;
            }
    
            checkRemainingInterestStatus();
    
           
            var checkedValue = $('input[id*=loanTypeCheck]:checked').val();
            if (checkedValue === "Cash")
            {
                var repoId = parseInt($('#RepoDropDownList').val());
                if (isNaN(repoId)) {
                    bootbox.alert('<b class="text-red">Invalid repository</b><br/>Please choose transaction repository.');
                    return;
                }
            }
            if (checkedValue === "Dharauti") {
                var sbmittedAmount = parseFloat($('#SubmittedAmountTextBox').val());
                var loancollecBlnce = parseFloat($('#LoanCollectionBalanceTextBox').val());
    
                if (sbmittedAmount > loancollecBlnce) {
                      
                    bootbox.alert('<b class="text-red">Invalid Input</b><br/>Submitted Amount Cannot be greater then Collection Balance.');
                    return true;
                }
            }
    
            if (checkedValue === "Deposit") {
                var sbmtAmount = parseFloat($('#SubmittedAmountTextBox').val());
                var depBalance = parseFloat($('#DepositAccountBalance').val());
    
                if (sbmtAmount > depBalance) {
                    bootbox.alert('<b class="text-red">Invalid Input</b><br/>Submitted Amount Cannot be greater then Deposit Account Balance.');
                    return true;
                }
    
            }
         
            __doPostBack("<%= SaveButton.UniqueID %>", "");
    
             
        });

    Here all other validation works.Only the one with the function call is not.Help please.weird.

    Tuesday, July 31, 2018 1:44 PM

Answers

  • User475983607 posted

    AJAX is asynchronous.  The checkRemainingInterestStatus() returns before the success handler is invoked.  

    A simple fix is moving the logic into the success handler.  I have no way to test this but hopefully the following code illustrates what to do.

      function checkRemainingInterestStatus() {
            var remainingInterest = parseFloat($("#ActualRemainingInterestTextBox").val());
            var remainingPrinci = parseFloat($("#ActualRemainingPrincipalTextBox").val());
            $.ajax
            ({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "/WebMethods/Misc.asmx/GetRemainingInterestParamater",
                success: (function(data) {
                    var result = data.d;
                    if (result === false) {
                        debugger;
                        //alert('test');
                        if (remainingInterest > 0 || remainingPrinci < 0) {
                            alert('Reached here');
                        }
    					else {
    						var checkedValue = $('input[id*=loanTypeCheck]:checked').val();
    						if (checkedValue === "Cash")
    						{
    							var repoId = parseInt($('#RepoDropDownList').val());
    							if (isNaN(repoId)) {
    								bootbox.alert('<b class="text-red">Invalid repository</b><br/>Please choose transaction repository.');
    								return;
    							}
    						}
    						if (checkedValue === "Dharauti") {
    							var sbmittedAmount = parseFloat($('#SubmittedAmountTextBox').val());
    							var loancollecBlnce = parseFloat($('#LoanCollectionBalanceTextBox').val());
    
    							if (sbmittedAmount > loancollecBlnce) {
    								  
    								bootbox.alert('<b class="text-red">Invalid Input</b><br/>Submitted Amount Cannot be greater then Collection Balance.');
    								return true;
    							}
    						}
    
    						if (checkedValue === "Deposit") {
    							var sbmtAmount = parseFloat($('#SubmittedAmountTextBox').val());
    							var depBalance = parseFloat($('#DepositAccountBalance').val());
    
    							if (sbmtAmount > depBalance) {
    								bootbox.alert('<b class="text-red">Invalid Input</b><br/>Submitted Amount Cannot be greater then Deposit Account Balance.');
    								return true;
    							}
    
    						}
         
    						__doPostBack("<%= SaveButton.UniqueID %>", "");
    					}
                    }
                }),
                error: (function() {
                    alert("error");
                })
            });
    
        }

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, July 31, 2018 2:00 PM

All replies

  • User475983607 posted

    AJAX is asynchronous.  The checkRemainingInterestStatus() returns before the success handler is invoked.  

    A simple fix is moving the logic into the success handler.  I have no way to test this but hopefully the following code illustrates what to do.

      function checkRemainingInterestStatus() {
            var remainingInterest = parseFloat($("#ActualRemainingInterestTextBox").val());
            var remainingPrinci = parseFloat($("#ActualRemainingPrincipalTextBox").val());
            $.ajax
            ({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "/WebMethods/Misc.asmx/GetRemainingInterestParamater",
                success: (function(data) {
                    var result = data.d;
                    if (result === false) {
                        debugger;
                        //alert('test');
                        if (remainingInterest > 0 || remainingPrinci < 0) {
                            alert('Reached here');
                        }
    					else {
    						var checkedValue = $('input[id*=loanTypeCheck]:checked').val();
    						if (checkedValue === "Cash")
    						{
    							var repoId = parseInt($('#RepoDropDownList').val());
    							if (isNaN(repoId)) {
    								bootbox.alert('<b class="text-red">Invalid repository</b><br/>Please choose transaction repository.');
    								return;
    							}
    						}
    						if (checkedValue === "Dharauti") {
    							var sbmittedAmount = parseFloat($('#SubmittedAmountTextBox').val());
    							var loancollecBlnce = parseFloat($('#LoanCollectionBalanceTextBox').val());
    
    							if (sbmittedAmount > loancollecBlnce) {
    								  
    								bootbox.alert('<b class="text-red">Invalid Input</b><br/>Submitted Amount Cannot be greater then Collection Balance.');
    								return true;
    							}
    						}
    
    						if (checkedValue === "Deposit") {
    							var sbmtAmount = parseFloat($('#SubmittedAmountTextBox').val());
    							var depBalance = parseFloat($('#DepositAccountBalance').val());
    
    							if (sbmtAmount > depBalance) {
    								bootbox.alert('<b class="text-red">Invalid Input</b><br/>Submitted Amount Cannot be greater then Deposit Account Balance.');
    								return true;
    							}
    
    						}
         
    						__doPostBack("<%= SaveButton.UniqueID %>", "");
    					}
                    }
                }),
                error: (function() {
                    alert("error");
                })
            });
    
        }

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, July 31, 2018 2:00 PM
  • User411771660 posted
    Got this working for the said problem.working inside with other validations.thank you sir.can you explain "success handler invoked " sir?
    Tuesday, July 31, 2018 2:40 PM
  • User475983607 posted

    Got this working for the said problem.working inside with other validations.thank you sir.can you explain "success handler invoked " sir?

    Read the jquery AJAX documentation.  Success is an AJAX request handler that you are using in your code.

    http://api.jquery.com/jquery.ajax/

    Tuesday, July 31, 2018 3:06 PM
  • User411771660 posted

    Thank you 

    Tuesday, July 31, 2018 5:11 PM
  • User475983607 posted

    I simply copied all the logic after the the call to checkRemainingInterestStatus() since this function is responsible for making the AJAX call.  Again the function returns before the success handler runs and returns false.  I assumed you wanted to keep the logical order as written. 

    Tuesday, July 31, 2018 5:54 PM