0

Good day,

Part of a form I created consists of two groups of radio buttons that display specific text depending on which button is selected.

If a user clicks the submit button, but hasn't incorectly inputed something wrong (or has missed a field), the page reloads and displays an error at the top. Unfortunately, the radio button are resetted to no selection, so the user has to choose the options again in order to display the relevant text that needs to be amended.

How can I make it so the radio buttons do not reset once the page reloads (i.e. there selections will be saved)?

Note: I cannot stop the page from reloading after a user clicks submit; it's just the way the CMS is set up.

I've tried some scripts and searched Google, but I cannot seem to get anything to work due to the restrictions of the ancient CMS I'm working with.

<p id="submit">Please select one of the following:<strong class="required" style="color:red">(required)</strong></p><div>

// Here is one of the radio button groups that need to be saved. You'll notice that they are calling a script to display specific text when selected

<input type="radio" name="type" id="selection1" onclick="myOwnBehalf()" required> I am submitting this question on my on own behalf.<br/>
<input type="radio" name="type" id="selection2" onclick="onBehalfSomeone()" required> I am making this question on behalf of someone else.<br/>
<input type="radio" name="type" id="selection3" onclick="anon()" required> I would like to be anonymous.<br/>

....

The radio button selections are reset to blank once the page reloads because the users filled it out incorrectly.

johng_g
  • 1
  • 1
  • Possible duplicate of [How to reload current page without losing any form data?](https://stackoverflow.com/questions/17591447/how-to-reload-current-page-without-losing-any-form-data) – vityavv Jun 11 '19 at 16:55

1 Answers1

0

Each time you navigate to a new page (or back to the same page) all of the JavaScript state is lost.

That means you need to pass the old state to the new page one way or another. Here are some ways of doing this:

These require using a scripting language like PHP for your pages:

  • PHP session (if you're using the PHP scripting language)
  • Navigate using form POST instead of a simple link

These could be done with just JavaScript

  • CGI variables in the URL you navigate to, for example mypage.php?choice1=3&choice2=5
  • Set a cookie then read it
  • HTML5 LocalStorage

(CGI variables: How to get the value from the GET parameters? )

Dave S
  • 1,427
  • 1
  • 16
  • 18