Pre-Fill a Checkbox or Radio Field from a Page Link Selected from Another Page?

Question

So I've been having an unfulfilling experience trying to figure out how I can auto-fill/select a checkbox or radio field from a designated link on another page.

Thus far, I have figured out how to select certain input fields when clicking a directed link on the form's page itself with the following function/HTML:

The script:

And the HTML (on the form's page itself):

<a href='' id='select-checkbox1'>Click to Select</a>

Is there a way to activate a function like this automatically via page load, (on the form's page), initially prompted by a link on another page?

Then I was also thinking that maybe a field could be auto-filled when in correspondence with a specific hash target/anchor called in a URL. Any ideas?

Assistance would be very much appreciated, as I have limited expertise with Javascript/JQuery...

Thank you.

Answer 1

You could use the solution from this question: How can I get query string values in JavaScript?

for example like this:

function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, "\\$&");
    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
    results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, " "));
}

$('#checkbox1).prop('checked', getParameterByName('checkbox1'))

The link on the other page could be like this:

<a href='pagewithcheckbox.html?checkbox1=checked' id='select-checkbox1'>Click to Select</a>

Answer 2

It is possible to carry the information from page A to page B using a hash.

That is if you don't want to use a server-side resource.

Page A:

<a href='pageB.html#myHash' id='select-checkbox1'>Click to Select</a>

Page B:

$(document).ready(function(){
  var hash = location.hash;  // Here, it would be "#myHash"... So including the #

  if(hash=="#myHash"){
    $("#checkbox1").prop("checked", !$("#checkbox1").prop("checked") );  // that toggles the checked state
  }
});