How to Make a checkbox not selected if there is no previous checkbox selection?

Asked

Viewed 547 times

0

I have a stack of tuition, where each one meet in a select.

I would like, at first, all of them to be disabled except the first check, and when enabling the first check, the second check could be available to be enabled, and if I disable the first check, the second check is unavailable (disable) to be enabled and so on.

That is, I can only select a checkbox if the previous chekbox is selected

I would like to do this with jquery or pure php or with other suggestions.

<input type="checkbox" > Janeiro
<input type="checkbox" > Fevereiro
<input type="checkbox" > Março
<input type="checkbox" > Abril`
  • and what is your question? can put the html code and javascript of what you have done to help?

  • 1

    wouldn’t that be anything like that? https://answall.com/questions/158010/habilitar-e-disablilitar-bot%C3%A3o-save

1 answer

2


A function can be made for when you click on a checkbox check if it is checked, if it is enabled the next one, otherwise disable the next one and uncheck also even disabled.

Initially it is best to leave only the first enabled on HTML.

$(".meses").click(function(){
  let meses = document.querySelectorAll(".meses");
  for (let i = 0; i < meses.length; i++) {
    if (meses[i].checked && i+1 < meses.length){
      meses[i+1].removeAttribute("disabled");
    } else {
      if (i+1 < meses.length) {
        for (let j = i+1; j < meses.length; j++) {
          meses[j].checked = false;
          meses[j].setAttribute("disabled", "true");
        }
      }
    }
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<input class="meses" value="1" type="checkbox">Janeiro
<input class="meses" value="2" type="checkbox" disabled="disabled">Fevereiro
<input class="meses" value="3" type="checkbox" disabled="disabled">Março
<input class="meses" value="4" type="checkbox" disabled="disabled">Abril

  • Thank you very much Dearest... That was of great help....

Browser other questions tagged

You are not signed in. Login or sign up in order to post.