Uncaught RangeError: Maximum call stack size exceeded in jquery ajax call

Tags: , , ,



I have an issue with a jQuery ajax call. If I comment out the ajax call, it is works. It is passing all the validations and going to else which have ajax call. if i put some alert by commenting ajax call, it is working fine and showing the alert.

error in console : Uncaught RangeError: Maximum call stack size exceeded.

function submit() {
  var companyname = $('#companyname').val();
  var fname = $('#fname').val();
  var username = $('#email').val();
  var countrycode = $('#country-code').val();
  var mobile = $('#mobile').val();
  var captcha = $('#captcha').val();
  var countryid = $('#country-list').val();
  var ctype = $('#ctype').val();
  console.log(companyname);
  console.log(fname);
  console.log(username);
  console.log(countrycode);
  console.log(mobile);
  console.log(captcha);
  console.log(countryid);
  console.log(ctype);
  if(companyname == '') {
    Swal.fire({
          title: 'Enter Company Name',
          width: 500,
          padding: '1em',
          background: '#fff',
          backdrop: `
            rgba(0,0,123,0.4)
            left top
            no-repeat
          `
        })
  } else if(fname == '') {
    Swal.fire({
          title: 'Enter Admin Name',
          width: 500,
          padding: '1em',
          background: '#fff',
          backdrop: `
            rgba(0,0,123,0.4)
            left top
            no-repeat
          `
        })
  } else if(username == '') {
    Swal.fire({
          title: 'Enter Admin Email',
          width: 500,
          padding: '1em',
          background: '#fff',
          backdrop: `
            rgba(0,0,123,0.4)
            left top
            no-repeat
          `
        })
  } else if(countrycode == '') {
    Swal.fire({
          title: 'Select Country Code',
          width: 500,
          padding: '1em',
          background: '#fff',
          backdrop: `
            rgba(0,0,123,0.4)
            left top
            no-repeat
          `
        })
  } else if(mobile == '') {
    Swal.fire({
          title: 'Enter Admin Mobile',
          width: 500,
          padding: '1em',
          background: '#fff',
          backdrop: `
            rgba(0,0,123,0.4)
            left top
            no-repeat
          `
        })
  } else if(captcha == '') {
    Swal.fire({
          title: 'Enter Captcha',
          width: 500,
          padding: '1em',
          background: '#fff',
          backdrop: `
            rgba(0,0,123,0.4)
            left top
            no-repeat
          `
        })
  } else if(countryid == '') {
    Swal.fire({
          title: 'Select Country',
          width: 500,
          padding: '1em',
          background: '#fff',
          backdrop: `
            rgba(0,0,123,0.4)
            left top
            no-repeat
          `
        })
  } else {
      $.ajax({
        type: "POST",
        url: "<?php echo base_url(); ?>Home/createcsoorpartner_submit",
        data: {
          companyname: companyname,
          fname: fname,
          countryid: countryid,
          mobile: mobile,
          email: email,
          countrycode: countrycode,
          captcha: captcha,
          ctype: ctype,
        },
        success: function (data) {
          resultObj = $.parseJSON(data);
          console.log(resultObj);
          if(resultObj.result == "success") {
            Swal.fire({
              title: resultObj.msg,
              width: 500,
              padding: '1em',
              background: '#fff',
              backdrop: `
                rgba(0,0,123,0.4)
                left top
                no-repeat
              `
            }).then(function (result) {
                    if (result.value) {
                      window.location = "<?php //echo base_url(); ?>Home";
                    }
                  })
          } else {
            Swal.fire({
              title: resultObj.msg,
              width: 500,
              padding: '1em',
              background: '#fff',
              backdrop: `
                rgba(0,0,123,0.4)
                left top
                no-repeat
              `
            })
          } 
        }
  })(1);
  }
}

Answer

The error you get is one that $.ajax will generate if you try to pass a structure that has circular references in it.

If the data definition type is incorrect, the data cannot be successfully sent to the background. The background does not receive the data, the front end will always sent, and this loop causes the stack to overflow.

So all you have to do is keep in check that the parameters you are sending in ajax are right.



Source: stackoverflow