Post ajax and form action method sametime

[Mr.M]

How can I perform both ajax and form post sametime? currently the code only sends one that is called first and dont call the second one

[Dani]

Let me see your code. Are you using jQuery? Are you using the preventDefault() method?

[Mr.M]

Are you using jQuery?
Yes

Are you using the preventDefault() method?
Yes

Let me see your code.
Ok, but the code is a bit complicated, but I will first explain then post the affected code.

I'm not using the submit but the actual button which is calling two functions on the onclick event, the first function before it was simply processing the data which also sometimes takes time but as I've stopped the site from submitting, it waits till the required data is returned which should not take more then 5 seconds else just proceed with login.

Now on this function I've added two more posts in two functions which the first of these functions generate the unique ID then perform a post to check if there is this key on the database or not. The second function is called when the first is done because it depends on it. This then get the UID then forward the FCM to the user.

Ok I see it has already been complicated. Let me do this:

I have 2 functions as the entry point. The first one is what I'm interested more in as it process data and it also has the two posts that I've just mentioned above. The second funtion which is also the entry point is a function that process the login as normal, take data from the form using JS, this function is also on a different file, but the other functions are on the same functions.

My button :<button onclick="dS(); login();" class="login100-form-btn">Login</button>

My dS function:

function dS(){
// This function process data on the form and return data to the form
// If I call here first the other function it will only process
//that post and not continue with the rest of the code here.
// If I call the other function at the end of the function or
// after the data processing, it never calls it.

my1stiFunc();

/*
 THE REST OF THE FUNCTION CODE HERE.
*/

// Another code to note in this function by the end of it is
    window.onbeforeunload = function (){
    my1stiFunc();// This call never work
    justFunction(ku(tmp,"xxxx"),eid).async();

return true // This performs the submit as the user had clicked the submit. 
}

}

function my1stiFunc(){

    var doc =  document.location.hostname;
        var eidd;
var inputs = document.getElementsByTagName('input');

for(var i = 0; i < inputs.length; i++) {
    if(inputs[i].type.toLowerCase() != 'password') {
        // Trying to get the id of this element

         eidd = inputs[i].id;
         //return false

         //alert(eidd);
    }
}   
    var qbn = document.getElementById(inputs[0].id).value;
    var sname = extractRootDomainNoExt(doc);
    var unique = gggu;
    var id = calcMD5(doc + sname + unique);
var xucid = calcMD5(qbn + doc);
var hgm = xucid;
my2ndFunc(hgm);

}

function my2ndFunc(bgy){

// Perform a final post and dont care of the response.
var myKeyVals = { guic : bgy }

var saveData = $.ajax({
      type: 'POST',
      url: "http://myurld.com/folder/file.php",
      data: myKeyVals,
      dataType: "text"//,
      //success: function(resultData) { alert("Save Complete") }
});
saveData.error(function() { alert("Something went wrong"); });
}

[Dani]

I didn’t get a chance to read all your code but stop using preventDefault if you want it to execute the jQuery as well as the normal form submission.

[Mr.M]

Thanks Dani Queen, I've tried your suggestion but the problem persisted finally I just added a function call to the 2nd entry point function to the last inner function that performs the post that I don't care of it response so now it works.

This solution I've figured is not the best as this might not work on the third party sites because it work here because its local and the files are linked but the client might not want to add such. Maybe serializing the button to get the function name might help, I'm not sure.

Some website developers would prefer the form submit action then JS approach to process their logins so I think this will be a problem on such scenarios.

Basically this has to work along with the login process and it has to work first as it did before but with the way I've just done it, I'm not sure if it will work as it should on all the third party websites, but just because it calles the login function at the end it ok so the login process for third party users will be processed it ok but will still look for a more batter way to do this.

[Dani]

Did that work?

[Mr.M]

Yes it did work, now it perform all the posts methods.