Forcing one radio button to be checked when I click another

[nastyn8k]

So I have a checkout page with multiple packages. I have a couple radio buttons that if one is clicked, then I want the same value to be clicked on the other packages.

In my page, I have a radio button selection called “Van Delivery”. When that is clicked on one of the packages, I want all the other packages to be forced to select the “Van Delivery” button next to them too.

So I have this one:
input id=“shipping_method_0_local_pickup51” class=“shipping_method” type=“radio” name=“shipping_method[0]” data-index=“0” value=“local_pickup:51” checked=“checked”>
label for=“shipping_method_0_local_pickup51”>Van Delivery </label

And this one:
input id=“shipping_method_1_local_pickup51” class=“shipping_method” type=“radio” name=“shipping_method[1]” data-index=“1” value=“local_pickup:51” checked=“checked”>
label for=“shipping_method_1_local_pickup51”>Van Delivery</label

I’m guessing I need to say something like “If input shipping_method_0_local_pickup51 = checked then input shipping_method_1_local_pickup51 = checked”

I have no idea how to properly format that into a working php code though.

Any help is appreciated! Obviously, I am a noob. I’m just happy that basic knowledge and Wordpress has enabled me to get this far! LOL!

[frankbeen]

It doesn’t have to do anything with PHP since PHP runs on the webserver just before the result of it will be delivered to your browser (the client). In the browser you can use javascript to check your checkboxes when you need.

First you will have to add an so called EventListener to your formfield to execute some action if the status changes. You can do this on several ways but one is to add an extra onchange attribute on the formfield eg

<input type="checkbox" name="test" onchange="myFunction(this)">

Then you need to write a javascript function that performs the actions you want eg

<script>
function myFunction(cb) {
	if(cb.checked) {
		alert("You just checked the checkbox!");
    } else {
		alert("You UNchecked the checkbox!");
    }
}
</script>

Above example is your startup. Instead of the alerts you want a state change of other form fields. So you will need to know how to address those formfields. For this you will need the functions document.GetElementById() or document.getElementsByClassName() where the first one will always return one element and the other will return an array of elements. With the help of uncle Googl you will be able to find information and examples of those and other javascript functions.

[nastyn8k]

Woohoo!

Thank you so much for steering me in the right direction. I finally got it figured out.

I actually DID have to mess around with PHP before I could start trying to figure the script out. I had to edit the WooCommerce plugin code to make unique onchange names for each input. I added this to the php code that creates the input names, labels, etc. "onchange=“my%2$sFunction(this)”. That “%2$s” created the name that matches the ID that is automatically generated for each radio button. From there I was able to create unique functions for each button. Got it to work using your code plus the get ElementID.

Just added this under the if(cb.checked) section of the script
“document.getElementById(‘MyElementIdHERE’).checked = true;”

Thank you so much! I learned a lot and it feels good figuring it out!