在带滑块的表单中禁用提交按钮

I'm doing a survey, I was asked to do it with a slider instead of switching the page everytime the person pressed continue, I also need to not let the person switch to the next slider if nothing was checked

I have a function that executes onclick, I tried to disable the button if the person presses continue without marking anything, but the problem is that it disables it always and it doesn't enable it again

Questions

<div class="container">
    <h1 class="text-uppercase mb-0" >TITLE</h1>
    <hr class="star-light">
    <div id="carouselExampleControls" class="carousel slide" data-ride="carousel" data-interval="false">
    <div class="carousel-inner">
    <div class="carousel-item active" >  
    <div class="form-group row"> 


<!--                              S 1                                        -->
<!-- Q 1 -->


<div class="col-md-6 offset-md-3">
<label for="inputEmail4"><b>Q1.</b></label>
</div> 
    </div>
    <div class="form-check">
    <form action="" method="post">
    <input class="form-check-input" type="radio" name="radio" id="r1" value="si">
    <label class="form-check-label" for="r1">
          Yes
    </label>
    </div>
    <div class="form-check">
    <input class="form-check-input" type="radio" name="radio" id="r2" value="no">
    <label class="form-check-label" for="r2">
          No
    </label>
    </div>  
    </div>


<!--                              S 2                                        -->
<!--Q 2 -->


    <div class="carousel-item ">
    <div class="form-group">
    <label for="inputEmail4">&nbsp;<b>Q2</b></label>
    <div class="form-check">
    <input class="form-check-input" type="radio" name="radio2" id="r3" value="si">
    <label class="form-check-label" for="r3"> Yes </label>
    </div>

    <div class="form-check">
    <input class="form-check-input" type="radio" name="radio2" id="r4" value="no">
    <label class="form-check-label" for="r4">No</label>
    </div>


<!-- q3 -->

    <label for="inputPassword4">&nbsp;<b>Q3</b></label>
    <div class="form-check">
    <input class="form-check-input" type="radio" name="radio3" id="r5" value="si">
    <label class="form-check-label" for="r5">Yes</label>
    </div>

    <div class="form-check">
    <input class="form-check-input" type="radio" name="radio3" id="r6" value="no">
    <label class="form-check-label" for="r6">No</label>
    </div>    
    </div>
    </div>

Continue button from slider

  <br></br>
  <div class="container text-center" id="submitB">
  <a href="#carouselExampleControls" onclick="hello(); upCount()" id="submitbttn" role="button" data-slide="next" class="btn btn-info btn-lg" role="button" style="background: #62b539; width:140px; height: 52px;">Continuar</a>
  <br></br>
  </div>

Script i've tried to pull

<script type="text/javascript">
  function hello() {
    countClicks++;
    }

    var countClicks = 0;


    function upCount() { 
    /*Verify and send to PHP*/

    if (countClicks == 1){
      var one;
      if (document.getElementById('r1').checked) {
          one = document.getElementById('r1').value;
          document.getElementById("submitbttn").disabled = false;
          }
      else if (document.getElementById('r2').checked) {
        one = document.getElementById('r2').value;
        document.getElementById("submitbttn").disabled = false;
        }
        else 
        document.getElementById("submitbttn").disabled = true; 

      $.ajax({
        type:"POST",
        url:"save.php",
        data: {cont: countClicks,one:one},
        success: function(data){
          alert(data);
        }
        });
        } //Fin de 1
</script>

In each question I have to not let the person to see the next slider if nothing was marked on the radio button