Javascript 选择另一个<；h:selectOneRadio>；从内部一<；h:selectOneRadio>；

我正在尝试制作一个Facelet，上面有两行，每行包含两个单选按钮。我想这样做，如果第一行中选择了第一个单选按钮，那么第二行中的第二个单选按钮应该被选中，反之亦然。我正在尝试使用JavaScript，但更改仍然没有反映在浏览器中

下面是Javascript：

<script type="text/javascript">
  function radioSelect(val){
    if(val.id == "encrypted:1")
{
document.getElementById("protected:0").value = "false";
document.getElementById("protected:1").value = "true";
}
else
{
document.getElementById("protected:0").value = "true";
document.getElementById("protected:1").value = "false";
}

}
</script>

功能无线电选择（val）{
如果（val.id==“加密：1”）
{
document.getElementById（“受保护的：0”）.value=“false”；
document.getElementById（“protected:1”）.value=“true”；
}
其他的
{
document.getElementById（“受保护的：0”）.value=“true”；
document.getElementById（“protected:1”）.value=“false”；
}
}

下面是我的Facelet文件中的一段代码：

<h:selectOneRadio id="encrypted"
                value="#{uploadFileBean.encryption}" onclick="radioSelect(this);">
                <f:selectItem itemLabel="Yes" itemValue="true"></f:selectItem>
                <f:selectItem itemLabel="No" itemValue="false"></f:selectItem>
            </h:selectOneRadio>
<h:selectOneRadio id="protected"
                value="#{uploadFileBean.fileprotected}">
                <f:selectItem itemLabel="Yes" itemValue="true"></f:selectItem>
                <f:selectItem itemLabel="No" itemValue="false"></f:selectItem>
            </h:selectOneRadio>

---

当我试图编写这个JavaScript函数时，Ajax的改变不起作用

    <script type="text/javascript">
function radioSelect(val){
if(val.id == "encrypted:1")
{
document.getElementById("protected:0").value = "false";
document.getElementById("protected:1").value = "true";
}
if(val.id == "protected:1")
{
document.getElementById("encrypted:0").value = "false";
document.getElementById("encrypted:1").value = "true";
}
if(val.id == "encrypted:0")
{
document.getElementById("protected:0").value = "false";
document.getElementById("protected:1").value = "true";
}
if(val.id == "protected:0")
{
document.getElementById("encrypted:0").value = "true";
document.getElementById("encrypted:1").value = "false";
}
}
</script>

功能无线电选择（val）{
如果（val.id==“加密：1”）
{
document.getElementById（“受保护的：0”）.value=“false”；
document.getElementById（“protected:1”）.value=“true”；
}
如果（val.id==“受保护：1”）
{
document.getElementById（“加密的：0”）.value=“false”；
document.getElementById（“加密的：1”）.value=“true”；
}
如果（val.id==“加密：0”）
{
document.getElementById（“受保护的：0”）.value=“false”；
document.getElementById（“protected:1”）.value=“true”；
}
如果（val.id==“受保护：0”）
{
document.getElementById（“加密的：0”）.value=“true”；
document.getElementById（“加密的：1”）.value=“false”；
}
}

当您更改其更改的值时，您使用的JavaScript也能正常工作，但是为了在facelet上反映这些更改，您需要更新保存更改值的组件

f:ajax

标记将在这里完成所需的工作，因为它将更新facelet上的所有组件，facelet的id在

render

属性中提供。因此，每当对任何

h:selectOneRadio

执行某些操作时，下面的代码将更新另一个组件

<h:selectOneRadio id="encrypted" value="#{uploadFileBean.encryption}" onclick="radioSelect(this);">
   <f:selectItem itemLabel="Yes" itemValue="true"></f:selectItem>
   <f:selectItem itemLabel="No" itemValue="false"></f:selectItem>
   <f:ajax render="protected">
</h:selectOneRadio>
<h:selectOneRadio id="protected" value="#{uploadFileBean.fileprotected}">
   <f:selectItem itemLabel="Yes" itemValue="true"></f:selectItem>
   <f:selectItem itemLabel="No" itemValue="false"></f:selectItem>
   <f:ajax render="encrypted">
</h:selectOneRadio>

你确定那不应该是

document.getElementById（“protected”）

，因为我在里面没有看到

：0

？设置值时不检查单选按钮！我认为您需要根据执行操作的单选按钮重新渲染组件。是的，我尝试过“受保护”但是在Chrome上调试时，我找不到value属性，所以我使用了protected:0来更改它的值，但它没有这样做。@dShringi-我不明白你的意思，重新呈现组件？因为你更改了组件的值，您需要使用

重新渲染。请用文字解释问题和解决方案，而不是将其作为一个本地化的搜索和查找游戏。@BalusC我在回答中没有提到这一点，因为我已经在注释中解释过，更改值后需要重新渲染组件。当OP问我把

f:ajax

放在哪里时，我提供了代码。注释可以删除。答案应该是自我包含的。@BalusC Quiet true，将更新我的答案并牢记在心。