Calling PHP file from a slider page, how do I return to the active slide?

Question

I have a simple home-grown slider whose input is pulled from a MySQL database using PHP that echos the HTML for the slider page to build it. I am developing functionality to "add a comment" to the slider pictures which pulls up a hidden form when you click on the "Add a Comment" button. Once filling in that form and doing a Submit, I call an "updateComment.php" file that pulls the form posted values and does a CONCAT_WS to the Comments field for that picture in the slider sequence in the database.

I use a header('Location: ' .$_SERVER['HTTP_REFERER']); call at the end of the "updateComment.php" file to return to the slider page whose form submit called it. When it returns, it returns to the first slide page instead of the active slide page. It makes sense to me why that happens using that redirect method, but I am at a loss to figure out how to get it to return to the active slide page. I've been reading up on PHP redirects, but can't find anything that will work. Any sage words of advice or a clue how to do this?

Doing a Page Source of the slider page and stripping out all the detailed database field info built on that page, here is the code around the form's call to "updateComment.php".


    


  
     
     
     Name:
     
     Your Memory or Story of Tim:

Here is the actual "updateComments.php" code

 connect_error) {
      die("Connection failed:". $conn-> connect_error);
   }
   $firstname = $_POST['fname'];
   $lastname = $_POST['lname'];
   $memory = !empty($_POST['memory-story'])?$_POST['memory-story']:'';
   $name = !empty($_POST['commentor'])?$_POST['commentor']:'';
   $toappend = $memory . "
-- " . $name . "
";
   $sql = "UPDATE rip SET Comments = CONCAT_WS('',Comments,'$toappend') WHERE (ClassmateNameFirst = '$firstname' AND ClassmateNameLast = '$lastname')";
   $result = $conn-> query($sql);
   header('Location: ' .$_SERVER['HTTP_REFERER']);
?>

Slider functional code is:

The rest of the info on the slider page besides the active image displayed includes the Comments field and that page is built using an HTML table. Each slider page is its own table, dozens of images with a table entry for each, all built by the database pulls using PHP code to render the page.

IT goldman · Answer

My idea is to submit current_slide along with the form. Then server knows to redirect back to page with extra param "$page?current_slide=" . $current_slide;. This param would then be analyzed when initializing the slider, to start from the correct slide.

Some code:

function update_current() {
  var current_slide = 12; // get from slider
  document.getElementById("current_slide").value = current_slide;
}


  
  
  
  Name:
  
  Your Memory or Story of Tim:

Then on server:

// TODO: append query string parameter in a better way
header('Location: ' .$_SERVER['HTTP_REFERER'] . "?current_slide=" . $_POST["current_slide"]);

Then back on load of client:

const urlParams = new URLSearchParams(window.location.search);
const current_slide = urlParams.get('current_slide');

// TODO: goto slide current_slide

UPDATE:

another idea would be using the localStorage to store the state of the slider right before submitting it. Then, when loading all you need is getItem from localStorage and check it.

// when submitting
function update_current() {
  var current_slide = 12; // get from slider
  localStorage.setItem("current_slide", current_slide);
}


// when loading the page call:
function load_current() {
  var current_slide = localStorage.getItem("current_slide")
  if (current_slide) {
    // set slider slide to be current_slide
  }
}

Calling PHP file from a slider page, how do I return to the active slide?

1 Answers