CODEWITHSUNDEEP
javascriptphpjqueryajax
Jason Hunn
Jason Hunn

Reputation: 41

Ajax / Jquery refresh page after variables are passed

Okay so am using Ajax to send a JS variable from index.php to page2.php . Once it is set to page2.php, the database is edited while the user has been on index.php the entire time. However, I need the index.php to reload or refresh once page2.php has finished updating the database in the background. To give you a better clue, I will include some of my code.

On Index.PHP is :

<a href='#' class='dbchange' onclick='dbchange(this)' id='".$ID'>Update</a>

and

function dbchange(obj) {
    var id = $(obj).attr('id');
    $.ajax({
        type: "POST",
        url: 'page2.php',
        data: "NewID=" + id,
    });
}

So basically when they click the button that says "Update" it sends the ID of the button the page2.php and page2.php from there updates the changes the database using that info. However, the URL the user is on is:

http://website.com/index.php#

and the database has not updated for them and they have to see the annoying hash symbol in the URL. I have googled how to refresh the page in JS, and found things that either do not work or do work , but result in the variables not being sent to the PHP file. I just need it so that after it is sent to the php file, and preferably after the php file is finished, the index.php page refreshes and without the # at the end.

Upvotes: 1

Views: 1816

Answers (2)

user5051310
user5051310

Reputation:

e.preventDefault() is the answer but if I may suggest:

Get rid of that inline function and add the event handler with jQuery. 

$(function () {
  $('.dbchange').click (function (e) {
    e.preventDefault();
    var id = this.id;
    $.ajax({
      type: "POST",
      url: 'page2.php',
      data: {NewID: id},
      success: function(data) {
        window.location.reload();
      }
    });
  });
});

Upvotes: 2

Nere
Nere

Reputation: 4097

Remove # then replace with javascript:void(0):

<a href='javascript:void(0)' class='dbchange' onclick='dbchange(this)' id='".$ID'>Update</a>

JS:

function dbchange(obj) {
    var id = $(obj).attr('id');
    $.ajax({
        type: "POST",
        url: 'page2.php',
        data: "NewID=" + id,
        success: function() {
            window.location.reload();
        }
    });
}

Upvotes: 0

Related Questions