My script is causing infinite loop

Question

To begin with: I'm a total newb. These functions are the first I have ever written. I use Wordpress (and the most important plugin used on the site is called BuddyPress). What I essentially want the script to make is delete something from my database and then reload the page one time when pressing a certain link. Nothing more.

I have an issue with Internet Explorer where my page gets stuck in an infinite loop. This problem doesn't occur on Chrome at all. I have a PHP containing the following:

<li><a id="edit" href="#" onclick="runUpdateForm();">Uppdatera profil</a></li>

When pressing the link the following script is run:

<!--Javascript runUpdateForm-->
<script type="text/javascript">
function runUpdateForm() {
    $.post ( ajaxurl, {
      action:'resetUser',
          user_id:jQuery("#user_id").val()
          });
    window.location.reload();
}
</script>
<!--End Javascript runUpdateForm-->

In my functions-file the following is found:

function resetUser() {
  $user_id=get_current_user_id();  
  global $wpdb;   
  $wpdb->query("DELETE FROM wp_profile_updates WHERE user_id='".$user_id."'");
  die(); // close the connection
}

add_action('wp_ajax_resetUser', 'resetUser'); // add action for logged users
add_action( 'wp_ajax_nopriv_resetUser', 'resetUser' ); // add action for unlogged users

After Googling a bit I found the following piece of code which I put right above location.reload():

history.pushState("", document.title, window.location.pathname + window.location.search);

This made the infinite-loop go away but still it reloads one time to much in Internet Explorer, in comparision to Chrome and what I actually want to happen.

Sorry for my poor English. I'm a Swede :-)

I appreciate the help. I need someone with knowledge to tell me if they see anything right away which looks crazy and should be changed. My problem maybe is related to other stuff happening on my site.

Regards.

Answer 1

Your code does: start the ajax, then reload. as ajax is async, it will never post to the server, its interrupted by the reload. So you need to await the ajax:

<script type="text/javascript">
function runUpdateForm() {
  $.post ( ajaxurl, {
     action:'resetUser',
     user_id:jQuery("#user_id").val()
      },function(){
        // executed on success
        window.location.reload();
      });
 }
 </script>

also, im wondering where ajaxurl is defined...