单选按钮和复选框组合在一起MVC [英] Radio buttons and checkboxes grouped together MVC

问题描述

我试图找到一个MVC（剃刀）解决方案，我可以使用单选按钮和复选框在一起。

I'm trying to find an MVC (razor) solution where I can use radio buttons and checkboxes together.

说，有2 单选按钮标记：所有的人的和的家庭成员的

Say there are 2 radiobuttons labelled: All people and Family Members.

如果您选择了家庭成员单选按钮 3 复选框应启用：雇员， 配偶，家属（S）

If you select the "Family Members" radio button, 3 checkboxes should be enabled: "Employee", "Spouse", "Dependant(s)"

的问题是：

• 如何组单选按钮，复选框3？


• 如何启用
  当选择复选框相关的单选按钮？

推荐答案

好吧，你可以做到以下几点：

Well you could do the following:

 <ul>
      <li><input type="radio">All People</input></li>
      <li>
          <input type="radio" class="toggle-family">Family Members</input>
          <ul class="member-selection hide">
              <li><input type="checkbox">Employee</input></li>
              ...
          </ul>
      </li>
 </ul>

然后在你的JavaScript，你可以做到以下几点：

Then in your javascript you could do the following:

 $(function() {
      $('.toggle-family').change(function() {
         if ($(this).attr('checked')) {
             $('.member-selection').removeClass('hide');
         } else {
             $('.member-selection').addClass('hide');
         }
      });
 });

然后你需要只定义称为隐藏CSS类，并将其设置显示属性无法比拟的。这只是一个想法，让你开始，希望它帮助。

Then you would need to just define a css class called "hide" and set it display attribute to none. This is just an idea to get you started, hope it helps.

这篇关于单选按钮和复选框组合在一起MVC的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！