0

I am storing pages as divs as the following

<div id="page-1" class="page db">
  <!-- Page Contents -->
  <button id="get-page2">Go To Page 2</button>
</div>

<div id='page-2' class="page dn">
  <!-- Page Contents -->
  <button id="back-page-1">Back Page One</button>
</div>

I give the div an id to define the page name and the class .page to tell JavaScript that this is a page div to switch between them later, and the class db stands for display block, the class dn stands for display none, my JavaScript code has a function (getPage(pageId)) that switches between pages, in case needed:

function getPage(pageId) {
    let pages = $('.page'); // get all pages
    for (i = 0; i < pages.length; i++) {
        let currentClass = $(`#${pages[i].id}`) // get current class id
        if (currentClass.attr('id') == pageId) { 
            currentClass.attr('class', 'page db'); // if the div id matches the argument pageId it will switch the class dn with db to show the div
        } 
        else {
            currentClass.attr('class', 'page dn'); // otherwise it will hide it because it is not the needed page
        }
    }
}

dn and db in CSS file:

.db {display: block;}
.dn {display: none;}

Anyway I had this HTML code which is about a report page with a form

<div id="report" class="page dn">
  <div class="center top-margin">
    <form method="POST" data-netlify="true" name="report">
      <textarea placeholder="describe your problem here" name="problem"></textarea><br>
      <button type="submit" class="textarea-width">Submit</button>
      <button class="back-home textarea-width">Back</button>
    </form>
  </div>
</div>

and my problem is that when I click the back button it is directing me to a page that says

This page isn’t working
If the problem continues, contact the site owner.
HTTP ERROR 405

Even if I did not submit the form, it shows me that

NOTE: I put data-netlify="true" because it is a website that allows me to get submitted forms, I add this to receive the form there later, I tried to host the website there, and the form is also being submitted but without the error code 405, where is the problem why is it being submitted on clicking back? if there is no way to fix this please recommend me any other solutions.

EDIT: I have tried to put the back button out of the form and put it in the div that is within the classes center and margin-top but the same thing is happening

Kh4lid MD
  • 119
  • 1
  • 10
  • 1
    You must specify `type="button"` if the button is not a submit button, see: https://stackoverflow.com/questions/3314989/can-i-make-a-button-not-submit-a-form – Rylee Sep 14 '21 at 05:39

0 Answers0