PHP - 设置选项时启用按钮

Question

I have a form with two radio buttons and a select.
I need to enable the submit button as soon as one of the radio buttons or the options in the select is selected. At the same time I need to disable everything else.
Let's say we have two radio buttons and three options in the select.
If I select one option in the select I want to enable the submit button AND disable the radio buttons.
If I select one of the radio buttons, I want to enable the submit button AND disable the select.

This is the HTML code:

<form class="form-horizontal" method="post" data-toggle="validator">


  <div class="form-group" has-feedback>
    <label class="col-sm-3 control-label">
      RADIO BUTTONS
    </label>
    <div class="cc-selector-2 col-sm-6 ">
      <input type="radio" name="radio" />
      <input type="radio" name="radio" />

    </div>
    <div class="col-sm-3">
      <div class="help-block with-errors"></div>
    </div>
  </div>

  <br>

  <div class="form-group" has-feedback>
    <label class="col-sm-3 control-label">
      SELECT
    </label>
    <div class="col-sm-6">
      <select class="form-control">
        <option value=""> One </option>
        <option value=""> Two </option>
        <option value=""> Three </option>

      </select>
    </div>
  </div>
  <br>
  <div class="form-group" has-feedback>
    <div class="col-sm-6 col-sm-offset-3">
      <button type="submit" class="btn btn-primary">
        SUBMIT
      </button>
    </div>
  </div>

</form>

I've tried adding request to the radios and to the select but it doesn't work...
Obviously I could do it with js but I was wondering if there's a simpler solution...

</div>

Answer 1

First of all, change your dropdown list something like this:

<select class="form-control">
    <option value="1"> One </option>
    <option value="2"> Two </option>
    <option value="3"> Three </option>
</select>

Then on click radio button, you can set jQuery code like below to hide button and select box on checking radio box.

$("input[name=radio]").on('click', function() {

        var checked = $("input[name=radio]").prop('checked');
        if(checked) { 
            $("button.btn").attr("disabled", true);
            $("select.form-control").attr("disabled", false);

        } 
        else { 
            $("button.btn").attr("disabled", false);
            $("select.form-control").attr("disabled", true);
        }   
    })

On change Dropdown list you can hide radio button and show submit button by matching option value.

$('select.form-control').on('change', function() {
        var theVal = $(this).val();
        switch(theVal){
            case '1':
              $("button.btn").attr("disabled", true);
              $("input[name=radio]").attr("disabled", false); 
              break;
            case '2':
              $("button.btn").attr("disabled", true);
              $("input[name=radio]").attr("disabled", true);
              break;
            case '3':
              $("button.btn").attr("disabled", true);
              $("input[name=radio]").attr("disabled", true);
              break;  
        }
    });

Like this you can set different action as well on selecting any specific value from dropdown.

Hope this might helpful for you.