-1

I have 2 checkboxes in my page. First id is "status_1", second id is "status_2"

I want to make that both of them must be selected on page load and always keep one selected, when trying to deselect both.

So for example if "status_1" is selected, "status_2" is not selected and user is trying do deselect "status_1" too, "status_2" select automatically.

Mantas
  • 3
  • 2
  • 1
    nice idea, please add your code as well. – Nina Scholz Aug 28 '18 at 13:45
  • so add onchange event, if current is unchecked, check the other..... seems like a simple thing to do. – epascarello Aug 28 '18 at 13:46
  • 2
    Typically the control you would use for "must select one or the other" is either a single on/off style checkbox or a two-state radio button. – jarmod Aug 28 '18 at 13:46
  • Possible duplicate of [check checkbox if another checkbox is checked](https://stackoverflow.com/questions/21372829/check-checkbox-if-another-checkbox-is-checked) - but then the opposite :-) – Peter B Aug 28 '18 at 13:48

2 Answers2

0

Here's a nice welcome gift for a new user on this website :-)
Normally we'd like to see what you have tried yourself, so we have some proof of effort since StackOverflow isn't a free programming service.

This code subscribes to the onchange event of the two checkboxes and checks the other one if both are unchecked. Since the actual logic is the same for each case I have moved it to a function to avoid repeating code.

function checkOther(a, b)
{
  if (!a.checked && !b.checked)
    b.checked = true;
}

window.addEventListener("load", function () {
  var s1 = document.querySelector("input[type='checkbox'][name='status_1']");
  var s2 = document.querySelector("input[type='checkbox'][name='status_2']");
  s1.addEventListener("change", function (e) {
    checkOther(e.target, s2);
  });
  s2.addEventListener("change", function (e) {
    checkOther(e.target, s1);
  });
}
<input type="checkbox" name="status_1" checked="checked" /> 1<br />
<input type="checkbox" name="status_2" checked="checked" /> 2
Cobra_Fast
  • 15,671
  • 8
  • 57
  • 102
-1
if (!$("#checkbox1").is(":checked") && !$("#checkbox2").is(":checked")) {
    // both of them are unchecked u can eather check one or drop error
}

you can initiate it on change of element so.

$("#checkbox1").change(function() {
    if(this.checked) {
        //Do stuff
    }
});

so in theory, you could create a function that checks if both unchecked and complete it with callback.

Thomas J.
  • 593
  • 8
  • 21
  • jQuery isn’t mentioned anywhere in the question. – Sebastian Simon Aug 28 '18 at 13:55
  • So him having an option for it (Maybe he doesn't know about it, since hes missing one tag) is wrong? That's why its a minus right. Hens my nickname.. If there is a better answer (which there is) it will for sure have more up votes then this. But you sir are a definition of a grumpy cat. :> Have a lovely day :) – Thomas J. Aug 28 '18 at 14:37
  • Neither the OP nor you mentioned jQuery anywhere. It’s not appropriate to answer with jQuery, when the OP didn’t explicitly ask for jQuery. – Sebastian Simon Aug 28 '18 at 15:58
  • @Xufox Well if he doesn't know about it, how would he know, if you go to a coffee shop, you decide ether you want black or light in there, eather you feel like eating desert or some lunch, don't you. However you did explain how should I improve my answer now (which how it's supposed to be), so it makes sense and adds up now. – Thomas J. Aug 29 '18 at 08:14