title: Two checkboxes in MVC, but only want to allow one at a time
body: <p>In my model I have two bool properties, Approved and Rejected. I would like them either as radio buttons or check boxes on the MVC view, but only want one to be selected at a time.</p>
  
  <p>Currently my view looks like this:</p>
  
  <pre><code>&lt;div class="form-group"&gt;
      @Html.LabelFor(model =&gt; model.Approved, htmlAttributes: new {@class = "control-label col-md-2"})
      &lt;div class="col-md-2"&gt;
          &lt;div class="checkbox"&gt;
              @Html.EditorFor(model =&gt; model.Approved, new { onclick="SingleCheckbox(this)" })
              @Html.ValidationMessageFor(model =&gt; model.Approved, "", new {@class = "text-danger"})
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="form-group"&gt;
      @Html.LabelFor(model =&gt; model.Rejected, htmlAttributes: new { @class = "control-label col-md-2" })
      &lt;div class="col-md-2"&gt;
          &lt;div class="checkbox"&gt;
              @Html.EditorFor(model =&gt; model.Rejected, new { onclick="SingleCheckbox(this)" })
              @Html.ValidationMessageFor(model =&gt; model.Rejected, "", new { @class = "text-danger" })
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And the javascript looks like this:</p>
  
  <pre><code>SingleCheckbox = function(rb) {
      debugger;
      var id = rb.id, uncheck;
      if (id == 'Approved') {
          uncheck = document.getElementById('Rejected');
      } else {
          uncheck = document.getElementById('Approved');
      }
  };
  </code></pre>
  
  <p>But when I inspect the element, it doesn't even have the onclick event.</p>
  
  <p>I've updated my code to reflect your recommendations (see above) and still have the same issue. The issue is that when I inspect the element the check box inputs DO NOT have an onclick event.</p>
  
  <p>Here is the rendered HTML:</p>
  
  <pre><code>&lt;div class="form-group"&gt;
      &lt;label class="control-label col-md-2" for="Approved"&gt;Approved&lt;/label&gt;
      &lt;div class="col-md-2"&gt;
          &lt;div class="checkbox"&gt;
              &lt;input class="check-box" id="Approved" name="Approved" type="checkbox" value="true"&gt;&lt;input name="Approved" type="hidden" value="false"&gt;
              &lt;span class="field-validation-valid text-danger" data-valmsg-for="Approved" data-valmsg-replace="true"&gt;&lt;/span&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="form-group"&gt;
      &lt;label class="control-label col-md-2" for="Rejected"&gt;Rejected&lt;/label&gt;
      &lt;div class="col-md-2"&gt;
          &lt;div class="checkbox"&gt;
              &lt;input class="check-box" id="Rejected" name="Rejected" type="checkbox" value="true"&gt;&lt;input name="Rejected" type="hidden" value="false"&gt;
              &lt;span class="field-validation-valid text-danger" data-valmsg-for="Rejected" data-valmsg-replace="true"&gt;&lt;/span&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>