Grails 单选按钮排列

Question

您好，我正在制作四个相互依赖的单选按钮。

按钮是第一、第二、A、B

First    Second
A         B

按钮就像我们选择 First 然后只有 First 被选中，按钮 A 和 B变为禁用。如果我们选择 Second，那么 A 和 B 都会启用，我们可以从中选择一个按钮。

<g:radioGroup name="RadioGrails"
              labels="['First','Second']"
              values="[1,2]">
<label>
        <span class="radioSpan">${it.radio}</span>
        ${it.label}
</label>
</g:radioGroup>

A 和 B 的单选按钮

<g:radioGroup name="ABRadioButtons"
                  labels="['A','B']"
                  values="[1,2]">
    <label>
            <span class="radioSpan">${it.radio}</span>
            ${it.label}
    </label>
    </g:radioGroup>

Answer 1

我会使用：

（当然要设置第二个radioGroup的初始状态……）

<g:radioGroup class="radiograils" name="RadioGrails" labels="['First','Second']" values="[1,2]">
    <label>
        <span class="radioSpan">
            ${it.radio}
        </span> ${it.label}
    </label>
</g:radioGroup>

<g:radioGroup class="abradiobuttons" name="ABRadioButtons" labels="['A','B']" values="[1,2]">
    <label>
        <span class="radioSpan">
            ${it.radio}
        </span> ${it.label}
    </label>
</g:radioGroup>

<script src="${request.contextPath}/js/jquery-2.0.2.min.js"></script>
<script type="text/javascript">
    $('.radiograils').change(function() {
        if ($(this).val() == 2) {
            $('.abradiobuttons').prop('disabled', false);
        } else {
            $('.abradiobuttons').prop('checked', false);
            $('.abradiobuttons').prop('disabled', true);
        }
    });
</script>