I have the following list of checkboxes. The way the list is output it allows the user to select more than one value. However, I need the user to be only allowed to select one single value from the list of checkboxes below.
Is it possible to somehow achieve this with jQuery? It would also be okay to change the list to radio buttons, select list or anything else that might help.
Unfortunately I have no access to the generating function, so I cannot change the output.
Thanks in advance
<form class="ajax-form" id="user-register" method="post" accept-charset="UTF-8" action="(...)">
(...)
<div id="edit-notifications-custom-custom-berlin-wrapper" class="form-item form-option">
<label for="edit-notifications-custom-custom-berlin" class="option"><input type="checkbox" class="form-checkbox" value="1" id="edit-notifications-custom-custom-berlin" name="notifications_custom[custom_berlin]"> Berlin</label>
</div>
<div id="edit-notifications-custom-custom-hamburg-wrapper" class="form-item form-option">
<label for="edit-notifications-custom-custom-hamburg" class="option"><input type="checkbox" class="form-checkbox" value="1" id="edit-notifications-custom-custom-hamburg" name="notifications_custom[custom_hamburg]"> Hamburg</label>
</div>
<div id="edit-notifications-custom-custom-frankfurt-am-main-wrapper" class="form-item form-option">
<label for="edit-notifications-custom-custom-frankfurt-am-main" class="option"><input type="checkbox" class="form-checkbox" value="1" id="edit-notifications-custom-custom-frankfurt-am-main" name="notifications_custom[custom_frankfurt-am-main]"> Frankfurt am Main</label>
</div>
<div id="edit-notifications-custom-custom-duesseldorf-wrapper" class="form-item form-option">
<label for="edit-notifications-custom-custom-duesseldorf" class="option"><input type="checkbox" class="form-checkbox" value="1" id="edit-notifications-custom-custom-duesseldorf" name="notifications_custom[custom_duesseldorf]"> Düsseldorf</label>
</div>
<div id="edit-notifications-custom-custom-bielefeld-wrapper" class="form-item form-option">
<label for="edit-notifications-custom-custom-bielefeld" class="option"><input type="checkbox" class="form-checkbox" value="1" id="edit-notifications-custom-custom-bielefeld" name="notifications_custom[custom_bielefeld]"> Bielefeld</label>
</div>
<div id="edit-notifications-custom-custom-muenchen-wrapper" class="form-item form-option">
<label for="edit-notifications-custom-custom-muenchen" class="option"><input type="checkbox" class="form-checkbox" value="1" id="edit-notifications-custom-custom-muenchen" name="notifications_custom[custom_muenchen]"> München</label>
</div>
(...)
asdasd
$('.form-checkbox').bind('click', function() {
$('.form-checkbox').not(this).attr('checked', false);
});
EDITED to optimize performance.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With