The best way to insert an integer into my table using previous/next buttons

Question

I have a slideshow where the user can click a button with an arrow on it pointing to go next and previous. When the user clicks on the arrow I want to save a page name in there, so it will redirect them to the correct page. I also want to store a number so when the user clicks previous or next, the integer will be saved in the correct table userTakingModule, under the checkPoint.

Table layout:

What is the best way to do this i.e. user a button tag inside of a form tag? I have pasted the two ways which I have so far tried to get to happen when the user clicks on one of the two arrows:

a.) Take the user back one page, by having the page1.html in the action of one arrow, and page3.html in the other arrow b.) Save on the button click, a value into the userTakingModule table.

html attempt 1.)

<div class="arrow-container">
  <form style="display: inline" action="dashboard.php" method="post">
  <button value="1"><i class="fas fa-arrow-circle-left"></i></button>
  </form>

<form style="display: inline" action="slide2.php" method="post">
  <button value="3"><i class="fas fa-arrow-circle-right"></i></button>
</form>
</div>

html attempt 2.)

<div>
<form action ="dashboard.php" method = "POST"> <!-- However I may need this page link to change depending on whether they click forward or back -->
    <label>Competition Categories</label>
    <select name="checkPoint">
    <option value="">Select</option>
    <option value="1">Previous</option>
    <option value="3">Next</option>
    </select>
    </fieldset>
    <button name="save_check_point" type="submit" type="button">View</button>
 </form>
</div>

The query I have so far is this:

<?php

  // The module ID will always be 5, as they are in the Stress & Anxiety slideshow which has an ID of 5 in the table.
  $idUsers = $_SESSION['id'];
  $ModuleID = 5;
  $checkPoint = $_POST['checkPoint'];

        // Preparing and binding my SQL query which inserts a checkpoint number into the table
        $stmt = $conn->prepare ("INSERT INTO `userTakingModule` (`userTakingModuleID`, `idUsers`, `ModuleID`, `checkPoint`) VALUES (NULL, ?, ?, ?)");

        $stmt->bind_param("iii", $idUsers, $ModuleID, $checkPoint);
        $stmt->execute();
?>

I've really been struggling on this for a while now so any help on this would be fantastic, thank you in advance.

Answer 1

I would suggest a simpler aproach. If your pages have the same name format: 'page' followed by the page number, and ending with the file extension (for example page2.html); then you don't need to use forms, since PHP can give you:

• The address (including the name of the script) of the current page
• The address of the page (if any) which referred the user agent to the current page.

If you don't need a reliable source for this, in security terms, you can use $_SERVER['SCRIPT_NAME'] and $_SERVER['HTTP_REFERER'] to get the info and use simple anchors to link the pages.

This is a PHP code that must be inserted in all slide pages, before your PHP code (that looks good), and before the HTML buttons:

<?php

//A simple function to parse script names and get your page number
function page_number($script_name){
  //Remove the first '/' character and the word 'page' to get '#.php'
  $number = substr($script_name,1+strlen('page'));
  //Remove the extension part to get just the page number 
  $number = substr($number,0,strpos($number,'.')); //
  return $number;
}

//Get the page script name, like '/page#.php'
$script_name = $_SERVER['SCRIPT_NAME'];
$n = page_number($script_name);

//Get the referer URL
$referer = $_SERVER['HTTP_REFERER'];
//Get the script name of that URL
$referer = substr($referer,strrpos($referer,'/'));
$checkPoint = page_number($referer);

?>

When this PHP code ends you have your $checkPoint integer ready to use in your PHP script. And the $n variable to use in the HTML links in the buttons.

This is the HTML for prev and next buttons:

<div class="arrow-container">
  <a href="page<?php echo($n-1); ?>.php">
    <i class="fas fa-arrow-circle-left"></i>
  </a>

  <a href="page<?php echo($n+1); ?>.php">
    <i class="fas fa-arrow-circle-right"></i>
  </a>
</div>

PS: Note the pages need the .php extension to work instead of .html extension.